/**
 * Go-Beyond Back-Office — shared UI (colors, motion, shell)
 */
 :root {
    /* Universal Design — pale & clear palette (blue · green · olive) */
    --gbs-ud-blue: #5d82c1;
    --gbs-ud-blue-light: #9db4e0;
    --gbs-ud-green: #44782d;
    --gbs-ud-green-light: #83a935;
    --gbs-ud-olive: #8e7e2c;
    --gbs-ud-chartreuse: #b5b132;

    --gbs-brand: var(--gbs-ud-blue);
    --gbs-brand-light: var(--gbs-ud-blue-light);
    --gbs-brand-dark: var(--gbs-ud-blue);
    --gbs-accent: var(--gbs-ud-blue-light);
    --gbs-accent-dim: rgba(139, 180, 220, 0.2);
    --gbs-dispatch: var(--gbs-ud-blue);
    --gbs-internal: var(--gbs-ud-blue-light);
    --gbs-company: var(--gbs-ud-blue);

    /* Material Design 3 — button tokens */
    --gbs-m3-btn-height: 2.5rem;
    --gbs-m3-btn-padding-x: 1.5rem;
    --gbs-m3-btn-radius: 1.25rem;
    --gbs-m3-fab-size: 3.5rem;
    --gbs-m3-on-primary: #ffffff;
    --gbs-m3-elevation-1: 0 1px 2px rgba(74, 127, 184, 0.2), 0 1px 3px rgba(74, 127, 184, 0.12);
    --gbs-m3-elevation-2: 0 2px 6px rgba(74, 127, 184, 0.24), 0 4px 12px rgba(74, 127, 184, 0.16);

    --gbs-sidebar-bg: linear-gradient(165deg, var(--gbs-ud-blue) 0%, var(--gbs-ud-blue) 50%, var(--gbs-ud-blue-light) 100%);
    --gbs-sidebar-border: rgba(148, 163, 184, 0.12);
    --gbs-surface: rgba(255, 255, 255, 0.92);
    --gbs-border: rgba(74, 127, 184, 0.18);
    --gbs-shadow: 0 4px 24px -4px rgba(15, 23, 42, 0.08), 0 0 0 1px rgba(255, 255, 255, 0.55) inset;
    --gbs-shadow-hover: 0 24px 48px -12px rgba(74, 127, 184, 0.22);
    --gbs-shell-sidebar-w: 17.5rem;

    /* List tables — Japanese-style grid (格子線) */
    --gbs-table-border: #64748b;
    --gbs-table-border-cell: #94a3b8;
    --gbs-table-head-bg: #dceaf5;
    --gbs-table-head-color: #1e293b;
    --gbs-table-row-alt: #f8fafc;
    --gbs-table-row-hover: #edf4fa;

    /* Japanese typography (Noto Sans JP / Yu Gothic) */
    --gbs-jp-font: "Noto Sans JP", "Yu Gothic", "YuGothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    --gbs-jp-text-base: 0.875rem;
    --gbs-jp-text-sm: 0.8125rem;
    --gbs-jp-text-xs: 0.75rem;
    --gbs-jp-text-label: 0.6875rem;
    --gbs-jp-leading: 1.65;
    --gbs-jp-leading-tight: 1.5;
    --gbs-jp-leading-heading: 1.4;
    --gbs-jp-tracking: 0.025em;
    --gbs-jp-tracking-tight: 0.015em;
    --gbs-jp-btn-height: 2.75rem;
    --gbs-jp-btn-height-compact: 2.25rem;
    --gbs-jp-nav-pad-y: 0.7rem;
    --gbs-jp-nav-pad-x: 0.85rem;
}

/* UD two-color utilities (medium blue + light blue only) */
.gbs-bg-ud-primary { background-color: var(--gbs-ud-blue); color: #fff; }
.gbs-bg-ud-light { background-color: var(--gbs-ud-blue-light); color: var(--gbs-ud-blue); }
.gbs-text-ud { color: var(--gbs-ud-blue); }
.gbs-text-ud-light { color: var(--gbs-ud-blue-light); }
.gbs-border-ud { border-color: var(--gbs-ud-blue); }
.gbs-border-ud-light { border-color: var(--gbs-ud-blue-light); }
.gbs-alert-ok {
    background: rgba(139, 180, 220, 0.22);
    color: var(--gbs-ud-blue);
    border: 1px solid rgba(139, 180, 220, 0.55);
}
.gbs-alert-err {
    background: rgba(74, 127, 184, 0.1);
    color: var(--gbs-ud-blue);
    border: 2px solid var(--gbs-ud-blue);
}

@keyframes gbs-gradient-shift {
    0%, 100% { background-position: 0% 40%; }
    50% { background-position: 100% 60%; }
}

@keyframes gbs-fade-up {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes gbs-pulse-soft {
    0%, 100% { opacity: 0.45; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.03); }
}

@keyframes gbs-nav-item-in {
    from {
        opacity: 0;
        transform: translateX(-12px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes gbs-page-surface {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.992);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes gbs-topbar-shine {
    0% { background-position: 0% 50%; }
    100% { background-position: 200% 50%; }
}

.gbs-app-bg {
    min-height: 100vh;
    min-height: 100dvh;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    background: linear-gradient(128deg, #f4f8fc 0%, #e8f2f8 45%, #edf4fa 75%, #f8fafc 100%);
    background-size: 260% 260%;
    animation: gbs-gradient-shift 24s ease-in-out infinite;
}

.gbs-orb {
    position: fixed;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
    animation: gbs-pulse-soft 8s ease-in-out infinite;
}

.gbs-orb-a {
    width: 460px;
    height: 460px;
    top: -140px;
    right: -100px;
    background: radial-gradient(circle, rgba(74, 127, 184, 0.28) 0%, rgba(139, 180, 220, 0.12) 45%, transparent 72%);
}

.gbs-orb-b {
    width: 400px;
    height: 400px;
    bottom: -120px;
    left: -80px;
    background: radial-gradient(circle, rgba(139, 180, 220, 0.22) 0%, rgba(74, 127, 184, 0.1) 50%, transparent 70%);
    animation-delay: -3s;
}

.gbs-wrap {
    position: relative;
    z-index: 1;
    height: 100%;
    min-height: 0;
}

/* —— App shell: sidebar + main (desktop / mobile drawer) —— */
.gbs-shell {
    display: flex;
    height: 100%;
    min-height: 0;
    max-height: 100vh;
    max-height: 100dvh;
    overflow: hidden;
    align-items: stretch;
}

.gbs-sidebar {
    width: var(--gbs-shell-sidebar-w);
    flex-shrink: 0;
    background: var(--gbs-sidebar-bg);
    border-right: 1px solid var(--gbs-sidebar-border);
    box-shadow: 8px 0 40px -12px rgba(15, 23, 42, 0.35);
    display: flex;
    flex-direction: column;
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 50;
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;
    transform: translateX(-100%);
    transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
    overflow: hidden;
}

.gbs-sidebar-head {
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    background: var(--gbs-sidebar-bg);
}

.gbs-sidebar-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding-bottom: 1.25rem;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.28) rgba(255, 255, 255, 0.06);
}

.gbs-sidebar-scroll::-webkit-scrollbar {
    width: 6px;
}

.gbs-sidebar-scroll::-webkit-scrollbar-track {
    margin: 0.35rem 0;
    background: rgba(255, 255, 255, 0.04);
    border-radius: 9999px;
}

.gbs-sidebar-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.22);
    border-radius: 9999px;
    border: 1px solid rgba(255, 255, 255, 0.08);
}

.gbs-sidebar-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.34);
}

.gbs-sidebar-scroll::-webkit-scrollbar-thumb:active {
    background: rgba(255, 255, 255, 0.42);
}

.gbs-main-column {
    scrollbar-width: thin;
    scrollbar-color: rgba(74, 127, 184, 0.38) rgba(148, 163, 184, 0.12);
}

.gbs-main-column::-webkit-scrollbar {
    width: 8px;
}

.gbs-main-column::-webkit-scrollbar-track {
    background: rgba(148, 163, 184, 0.1);
}

.gbs-main-column::-webkit-scrollbar-thumb {
    background: rgba(74, 127, 184, 0.35);
    border-radius: 9999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.gbs-main-column::-webkit-scrollbar-thumb:hover {
    background: rgba(74, 127, 184, 0.52);
    background-clip: padding-box;
}

@media (min-width: 1024px) {
    .gbs-sidebar {
        position: relative;
        z-index: 40;
        height: 100%;
        max-height: none;
        transform: none;
        transition:
            width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
            min-width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 0.28s ease,
            border-color 0.28s ease,
            box-shadow 0.28s ease;
    }

    .gbs-shell.gbs-sidebar-is-collapsed .gbs-sidebar {
        flex: 0 0 0;
        width: 0;
        min-width: 0;
        overflow: hidden;
        opacity: 0;
        border-right-color: transparent;
        box-shadow: none;
        pointer-events: none;
        visibility: hidden;
    }

    .gbs-shell.gbs-sidebar-is-collapsed .gbs-sidebar .gbs-sidebar-toggle--in-sidebar {
        display: none;
    }
}

@media (max-width: 1023px) {
    html.gbs-nav-open .gbs-sidebar {
        transform: translateX(0);
    }
}

.gbs-sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 40;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.35s ease, visibility 0.35s ease;
}

@media (min-width: 1024px) {
    .gbs-sidebar-backdrop {
        display: none;
    }
}

@media (max-width: 1023px) {
    html.gbs-nav-open .gbs-sidebar-backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
}

.gbs-main-column {
    flex: 1;
    min-width: 0;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100vh;
    max-height: 100dvh;
    display: flex;
    flex-direction: column;
    margin-left: 0;
    position: relative;
    z-index: 1;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* Full-width content shell (replaces fixed max-width layout) */
.gbs-page-container {
    width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
    padding-left: clamp(0.75rem, 2vw, 1.5rem);
    padding-right: clamp(0.75rem, 2vw, 1.5rem);
}

.gbs-page-content {
    width: 100%;
    max-width: 100%;
}

@media (min-width: 1024px) {
    .gbs-main-column {
        margin-left: 0;
    }
}

.gbs-topbar {
    position: sticky;
    top: 0;
    z-index: 60;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
    background: linear-gradient(105deg, rgba(255, 255, 255, 0.92) 0%, rgba(248, 250, 252, 0.88) 50%, rgba(255, 255, 255, 0.9) 100%);
    background-size: 200% 100%;
    animation: gbs-topbar-shine 18s ease-in-out infinite alternate;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset, 0 8px 32px -8px rgba(15, 23, 42, 0.06);
}

.gbs-nav-brand-block {
    padding: 1.35rem 1.25rem 1.1rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}

/* Sidebar brand — Japan calm SaaS (logo · Back-Office · tagline) */
.gbs-jp-sidebar-brand {
    padding: 1rem 1rem 0.85rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.gbs-jp-sidebar-brand__row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem 0.65rem;
}

.gbs-jp-sidebar-brand__logo-link {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.55rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.65);
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gbs-jp-sidebar-brand__logo-link:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.22);
}

.gbs-jp-sidebar-brand__logo-link:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.85);
    outline-offset: 2px;
}

.gbs-jp-sidebar-brand__logo {
    display: block;
    height: 1.75rem;
    width: auto;
    max-width: 5.75rem;
    object-fit: contain;
    object-position: left center;
}

.gbs-jp-sidebar-brand__meta {
    min-width: 0;
}

.gbs-jp-sidebar-brand__kicker {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.92);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-jp-sidebar-brand__collapse,
.gbs-jp-sidebar-brand__close {
    align-self: start;
}

.gbs-jp-sidebar-brand__collapse-icon {
    width: 1.15rem;
    height: 1.15rem;
    pointer-events: none;
}

.gbs-jp-sidebar-brand__tagline {
    margin: 0.7rem 0 0;
    padding: 0;
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.02em;
    color: rgba(255, 255, 255, 0.88);
}

html[lang="ja"] .gbs-jp-sidebar-brand__kicker,
html[lang="ja"] .gbs-jp-sidebar-brand__tagline {
    font-family: var(--gbs-jp-font);
    letter-spacing: 0.08em;
}

@media (max-width: 1023px) {
    .gbs-jp-sidebar-brand__close {
        display: inline-flex !important;
    }
}

@media (min-width: 1024px) {
    .gbs-jp-sidebar-brand__close {
        display: none !important;
    }
}

.gbs-nav-section-label {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.82);
    padding: 1rem 1.25rem 0.5rem;
}

.gbs-nav-list {
    list-style: none;
    margin: 0;
    padding: 0.35rem 0.75rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.gbs-nav-list li {
    opacity: 0;
    animation: gbs-nav-item-in 0.45s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-nav-list li:nth-child(1) { animation-delay: 0.04s; }
.gbs-nav-list li:nth-child(2) { animation-delay: 0.08s; }
.gbs-nav-list li:nth-child(3) { animation-delay: 0.12s; }
.gbs-nav-list li:nth-child(4) { animation-delay: 0.16s; }
.gbs-nav-list li:nth-child(5) { animation-delay: 0.2s; }
.gbs-nav-list li:nth-child(6) { animation-delay: 0.24s; }
.gbs-nav-list li:nth-child(7) { animation-delay: 0.28s; }
.gbs-nav-list li:nth-child(8) { animation-delay: 0.32s; }
.gbs-nav-list li:nth-child(9) { animation-delay: 0.36s; }
.gbs-nav-list li:nth-child(10) { animation-delay: 0.4s; }
.gbs-nav-list li:nth-child(11) { animation-delay: 0.44s; }
.gbs-nav-list li:nth-child(12) { animation-delay: 0.48s; }

.gbs-nav-link {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.95rem 1rem;
    border-radius: 0.85rem;
    font-size: 0.98rem;
    font-weight: 600;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(26, 45, 70, 0.28);
    text-decoration: none;
    border: none;
    transition:
        background 0.28s ease,
        color 0.2s ease,
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.28s ease;
}

.gbs-nav-link:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    transform: translateX(4px);
    box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.25);
}

.gbs-nav-link.is-active {
    background: linear-gradient(120deg, rgba(139, 180, 220, 0.35) 0%, rgba(74, 127, 184, 0.4) 100%);
    color: #fff;
    box-shadow: 0 12px 28px -10px rgba(74, 127, 184, 0.3);
}

.gbs-nav-emoji {
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    line-height: 1;
    transition: transform 0.28s ease, filter 0.2s ease;
}

.gbs-nav-link.is-active .gbs-nav-emoji {
    transform: scale(1.08);
    filter: drop-shadow(0 0 6px rgba(103, 232, 249, 0.45));
}

.gbs-nav-link:hover .gbs-nav-emoji {
    transform: scale(1.06);
}

.gbs-nav-group-wrap {
    list-style: none;
}

.gbs-nav-group {
    margin: 0.15rem 0;
}

.gbs-nav-group-summary {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.75rem 1rem;
    border-radius: 0.85rem;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.9);
    cursor: pointer;
    list-style: none;
    user-select: none;
    border: none;
    transition:
        background 0.25s ease,
        color 0.2s ease;
}

.gbs-nav-group-summary::-webkit-details-marker {
    display: none;
}

.gbs-nav-group-summary:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #e2e8f0;
}

.gbs-nav-group-summary--static {
    cursor: default;
    pointer-events: none;
}

.gbs-nav-group-summary--static:hover {
    background: transparent;
    color: rgba(255, 255, 255, 0.78);
}

.gbs-nav-group[open] > .gbs-nav-group-summary {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.04);
}

.gbs-nav-group-chevron {
    flex-shrink: 0;
    width: 0.45rem;
    height: 0.45rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    margin-left: 0.15rem;
    transition: transform 0.25s ease;
    opacity: 0.75;
}

.gbs-nav-group[open] .gbs-nav-group-chevron {
    transform: rotate(45deg);
    margin-top: -0.15rem;
}

.gbs-nav-sublist {
    list-style: none;
    margin: 0.2rem 0 0.35rem;
    padding: 0 0 0 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.gbs-nav-sublist > li {
    animation: none;
    opacity: 1;
}

.gbs-nav-link--sub {
    padding: 0.68rem 0.85rem 0.68rem 2rem;
    font-size: 0.88rem;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.86);
}

.gbs-nav-link--sub.is-active {
    background: linear-gradient(120deg, rgba(139, 180, 220, 0.35) 0%, rgba(74, 127, 184, 0.4) 100%);
    color: #ffffff;
    font-weight: 600;
}

.gbs-nav-subgroup-wrap {
    list-style: none;
}

.gbs-nav-subgroup {
    margin: 0.1rem 0 0.15rem;
}

.gbs-nav-subgroup-summary {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.72rem 0.85rem 0.72rem 1.65rem;
    border-radius: 0.85rem;
    font-size: 0.92rem;
    font-weight: 600;
    letter-spacing: 0.035em;
    text-transform: none;
    color: rgba(255, 255, 255, 0.95);
    text-shadow: 0 1px 2px rgba(26, 45, 70, 0.28);
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition:
        background 0.28s ease,
        color 0.2s ease,
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.gbs-nav-subgroup-summary::-webkit-details-marker {
    display: none;
}

.gbs-nav-subgroup-summary:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #ffffff;
}

.gbs-nav-subgroup[open] > .gbs-nav-subgroup-summary {
    color: rgba(255, 255, 255, 0.92);
    background: transparent;
}

.gbs-nav-subgroup-summary.is-expanded {
    color: rgba(255, 255, 255, 0.9);
    background: transparent;
}

.gbs-nav-subgroup-summary.has-active-child {
    color: rgba(255, 255, 255, 0.95);
    background: transparent;
    font-weight: 600;
}

.gbs-sidebar .gbs-nav-subgroup summary.gbs-nav-subgroup-summary {
    color: rgba(255, 255, 255, 0.95);
}

.gbs-sidebar .gbs-nav-subgroup summary.gbs-nav-subgroup-summary > span {
    color: inherit;
}

.gbs-nav-subgroup-chevron {
    flex-shrink: 0;
    width: 0.4rem;
    height: 0.4rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    margin-left: 0.1rem;
    transition: transform 0.25s ease;
    opacity: 0.7;
}

.gbs-nav-subgroup[open] .gbs-nav-subgroup-chevron {
    transform: rotate(45deg);
    margin-top: -0.12rem;
}

.gbs-nav-sublist--nested {
    margin: 0.1rem 0 0.2rem;
    padding: 0 0 0 0.85rem;
}

.gbs-nav-sublist--nested .gbs-nav-link--sub {
    padding-left: 2.35rem;
    font-size: 0.84rem;
}

.gbs-nav-subgroup--shift .gbs-nav-subgroup-summary.has-active-child {
    background: linear-gradient(120deg, rgba(96, 165, 250, 0.18) 0%, rgba(37, 99, 235, 0.22) 100%);
    border-radius: 0.85rem;
}

.gbs-nav-subgroup--shift[open] > .gbs-nav-subgroup-summary {
    background: rgba(255, 255, 255, 0.05);
}

.gbs-nav-subgroup--shift .gbs-nav-sublist--nested .gbs-nav-link--sub.is-active {
    background: linear-gradient(120deg, rgba(96, 165, 250, 0.28) 0%, rgba(37, 99, 235, 0.38) 100%);
    box-shadow: inset 0 0 0 1px rgba(191, 219, 254, 0.25);
}

.gbs-sidebar-tagline {
    color: rgba(255, 255, 255, 0.9);
}

.gbs-sidebar-footnote {
    color: rgba(255, 255, 255, 0.72);
}

.gbs-staff-only-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.375rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: #ffffff;
    background: var(--gbs-ud-blue);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 2px 8px rgba(42, 58, 82, 0.2);
}

.gbs-topbar-profile-btn {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    color: #ffffff;
    background: var(--gbs-ud-blue);
    border: 2px solid var(--gbs-ud-blue-light);
    box-shadow: 0 2px 10px rgba(74, 127, 184, 0.4);
    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.15s ease;
}

.gbs-topbar-profile-btn svg {
    width: 1.25rem;
    height: 1.25rem;
    stroke: currentColor;
    stroke-width: 2;
}

.gbs-topbar-profile-btn:hover {
    background: var(--gbs-ud-blue-light);
    color: var(--gbs-ud-blue);
    border-color: var(--gbs-ud-blue);
    box-shadow: 0 4px 14px rgba(74, 127, 184, 0.45);
    transform: translateY(-1px);
}

.gbs-topbar-profile-btn:focus-visible {
    outline: 2px solid var(--gbs-ud-blue);
    outline-offset: 2px;
}

.gbs-topbar-profile-btn.is-active {
    background: var(--gbs-ud-blue-light);
    color: var(--gbs-ud-blue);
    border-color: var(--gbs-ud-blue);
    box-shadow: 0 0 0 3px rgba(139, 180, 220, 0.55);
}

.gbs-page-enter {
    animation: gbs-page-surface 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(148, 163, 184, 0.25);
    background: rgba(255, 255, 255, 0.85);
    color: #334155;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.25s ease, border-color 0.2s ease;
}

.gbs-menu-btn:hover {
    transform: scale(1.04);
    box-shadow: 0 8px 20px -6px rgba(74, 127, 184, 0.2);
    border-color: rgba(74, 127, 184, 0.35);
}

.gbs-is-hidden {
    display: none !important;
}

.gbs-sidebar-toggle {
    position: relative;
    z-index: 2;
}

.gbs-sidebar-toggle-icon {
    display: block;
}

@media (min-width: 1024px) {
    .gbs-menu-btn:not(.gbs-sidebar-toggle) {
        display: none;
    }

    .gbs-sidebar-toggle {
        display: inline-flex;
        flex-shrink: 0;
    }

    .gbs-sidebar-toggle--in-sidebar {
        display: inline-flex;
        width: 2.25rem;
        height: 2.25rem;
        border-color: rgba(255, 255, 255, 0.15);
        background: rgba(255, 255, 255, 0.08);
        color: #e2e8f0;
    }

    .gbs-sidebar-toggle--in-sidebar:hover {
        background: rgba(255, 255, 255, 0.14);
        border-color: rgba(148, 163, 184, 0.35);
        color: #fff;
    }
}

@media (max-width: 1023px) {
    .gbs-sidebar-toggle--in-sidebar {
        display: none !important;
    }
}

.gbs-animate-in {
    animation: gbs-fade-up 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-animate-in-delay-1 {
    opacity: 0;
    animation: gbs-fade-up 0.5s cubic-bezier(0.22, 1, 0.36, 1) 0.1s forwards;
}

.gbs-animate-in-delay-2 {
    opacity: 0;
    animation: gbs-fade-up 0.5s cubic-bezier(0.22, 1, 0.36, 1) 0.18s forwards;
}

.gbs-animate-in-delay-3 {
    opacity: 0;
    animation: gbs-fade-up 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.26s forwards;
}

.gbs-animate-in-delay-4 {
    opacity: 0;
    animation: gbs-fade-up 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.34s forwards;
}

.gbs-animate-in-delay-5 {
    opacity: 0;
    animation: gbs-fade-up 0.55s cubic-bezier(0.22, 1, 0.36, 1) 0.42s forwards;
}

.gbs-card {
    border-radius: 1.125rem;
    background: var(--gbs-surface);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--gbs-border);
    box-shadow: var(--gbs-shadow);
    transition: box-shadow 0.35s ease, transform 0.3s ease, border-color 0.25s ease;
}

.gbs-card:hover {
    box-shadow: var(--gbs-shadow-hover);
    border-color: rgba(74, 127, 184, 0.22);
}

.gbs-card-static:hover {
    transform: none;
    box-shadow: var(--gbs-shadow);
}

.gbs-sidebar .gbs-nav-link--company-blue.is-active {
    background: linear-gradient(120deg, rgba(139, 180, 220, 0.32) 0%, rgba(74, 127, 184, 0.38) 100%);
}

.gbs-sidebar .gbs-nav-link--dispatch.is-active {
    background: linear-gradient(120deg, rgba(139, 180, 220, 0.32) 0%, rgba(74, 127, 184, 0.38) 100%);
}

.gbs-sidebar .gbs-nav-link--internal-green.is-active {
    background: linear-gradient(120deg, rgba(139, 180, 220, 0.28) 0%, rgba(139, 180, 220, 0.36) 100%);
}

.gbs-h1 {
    font-size: 1.25rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    background: linear-gradient(115deg, var(--gbs-ud-blue) 0%, var(--gbs-ud-blue) 42%, var(--gbs-ud-blue-light) 88%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gbs-h2 {
    font-size: 0.95rem;
    font-weight: 600;
    color: #334155;
}

/* M3 filled button (pill shape) */
.gbs-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: var(--gbs-m3-btn-height);
    padding: 0.625rem var(--gbs-m3-btn-padding-x);
    border: none;
    border-radius: var(--gbs-m3-btn-radius);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.006em;
    line-height: 1.25rem;
    color: var(--gbs-m3-on-primary);
    background: var(--gbs-brand);
    box-shadow: var(--gbs-m3-elevation-1);
    transition:
        background 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.15s ease;
}

.gbs-btn-primary:hover {
    background: var(--gbs-brand-light);
    box-shadow: var(--gbs-m3-elevation-2);
    transform: translateY(-1px);
}

.gbs-btn-primary:active {
    transform: translateY(0);
    box-shadow: var(--gbs-m3-elevation-1);
}

.gbs-btn-primary:focus-visible {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 2px;
}

/* M3 outlined button (pill shape) */
.gbs-btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--gbs-m3-btn-height);
    padding: 0.625rem var(--gbs-m3-btn-padding-x);
    border-radius: var(--gbs-m3-btn-radius);
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.006em;
    line-height: 1.25rem;
    color: var(--gbs-brand-dark);
    background: transparent;
    border: 1px solid var(--gbs-brand);
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.gbs-btn-secondary:hover {
    background: rgba(74, 127, 184, 0.08);
    border-color: var(--gbs-brand-dark);
    color: var(--gbs-brand-dark);
}

.gbs-btn-secondary:focus-visible {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 2px;
}

/* M3 FAB — circular primary action */
.gbs-btn-fab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--gbs-m3-fab-size);
    height: var(--gbs-m3-fab-size);
    padding: 0;
    border: none;
    border-radius: 50%;
    color: var(--gbs-m3-on-primary);
    background: var(--gbs-ud-blue);
    box-shadow: var(--gbs-m3-elevation-2);
    transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.gbs-btn-fab:hover {
    background: var(--gbs-ud-blue-light);
    box-shadow: 0 4px 14px rgba(74, 127, 184, 0.35);
    transform: scale(1.04);
}

.gbs-btn-fab--lime,
.gbs-btn-fab--light {
    background: var(--gbs-ud-blue-light);
}

.gbs-btn-fab--lime:hover,
.gbs-btn-fab--light:hover {
    background: var(--gbs-ud-blue);
}

.gbs-btn--dispatch.gbs-btn-primary {
    background: var(--gbs-dispatch);
}

.gbs-btn--dispatch.gbs-btn-primary:hover {
    background: var(--gbs-brand-light);
}

.gbs-btn--internal-green.gbs-btn-primary,
.gbs-btn--internal-green.gbs-btn-secondary {
    border-color: var(--gbs-internal);
}

.gbs-btn--internal-green.gbs-btn-primary {
    background: var(--gbs-ud-blue-light);
    color: var(--gbs-ud-blue);
}

.gbs-btn--internal-green.gbs-btn-primary:hover {
    background: var(--gbs-ud-blue);
    color: var(--gbs-m3-on-primary);
}

.gbs-btn--internal-green.gbs-btn-secondary {
    color: var(--gbs-ud-blue);
}

.gbs-input {
    width: 100%;
    border-radius: 0.65rem;
    border: 1px solid #e2e8f0;
    padding: 0.5rem 0.85rem;
    font-size: 0.9rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.gbs-input:focus {
    outline: none;
    border-color: var(--gbs-brand);
    box-shadow: 0 0 0 3px rgba(74, 127, 184, 0.22);
}

.gbs-input--cell {
    width: auto;
    min-width: 0;
    padding: 0.35rem 0.5rem;
    font-size: 0.8125rem;
}

.gbs-staff-list-table form.contents {
    display: contents;
}

.gbs-staff-list-row--edit td {
    vertical-align: top;
}

/* Inside staff list — sticky header + first four columns (社内社員一覧) */
.gbs-inside-staff-table-wrap {
    --gbs-inside-staff-head-row-h: 2.5rem;
    --gbs-inside-staff-body-row-h: 2.35rem;
    --gbs-inside-staff-visible-rows: 20;
    scrollbar-gutter: stable;
}

.gbs-inside-staff-table-wrap--scroll {
    overflow: auto;
}

.gbs-inside-staff-table-wrap--body-scroll {
    max-height: calc(
        var(--gbs-inside-staff-head-row-h) + var(--gbs-inside-staff-visible-rows) * var(--gbs-inside-staff-body-row-h)
    );
}

.gbs-inside-staff-table-wrap > .gbs-staff-list-table {
    border-collapse: separate;
    border-spacing: 0;
    width: max-content;
    min-width: 100%;
}

.gbs-inside-staff-table-wrap .gbs-inside-staff-sticky-col {
    position: sticky;
    z-index: 2;
    background-clip: padding-box;
}

.gbs-inside-staff-table-wrap .gbs-inside-staff-sticky-edge {
    border-right: 2px solid var(--gbs-table-border) !important;
    box-shadow: 2px 0 4px -2px rgb(15 23 42 / 0.1);
}

.gbs-inside-staff-table-wrap .gbs-staff-list-table thead {
    position: sticky;
    top: 0;
    z-index: 5;
}

.gbs-inside-staff-table-wrap .gbs-staff-list-table thead th {
    box-shadow: 0 1px 0 var(--gbs-table-border);
}

.gbs-inside-staff-table-wrap.gbs-table-wrap--col-resize > table thead th {
    position: sticky;
    top: 0;
    z-index: 5;
}

.gbs-inside-staff-table-wrap .gbs-staff-list-table thead .gbs-inside-staff-sticky-col {
    z-index: 7;
    background: var(--gbs-table-head-bg);
}

.gbs-inside-staff-table-wrap .gbs-staff-list-table tbody .gbs-inside-staff-sticky-col {
    z-index: 4;
    background: #fff;
}

.gbs-inside-staff-table-wrap .gbs-staff-list-table tbody tr:nth-child(even) .gbs-inside-staff-sticky-col {
    background: var(--gbs-table-row-alt);
}

.gbs-inside-staff-table-wrap .gbs-staff-list-table tbody tr:hover .gbs-inside-staff-sticky-col {
    background: var(--gbs-table-row-hover);
}

.gbs-table-wrap {
    border-radius: 0.5rem;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--gbs-table-border);
    background: #fff;
}

.gbs-table-wrap.gbs-inside-staff-table-wrap--scroll {
    overflow: auto;
}

/* Japanese-style bordered list tables (全セル格子線) */
.gbs-table-wrap > table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    background: #fff;
}

.gbs-table-wrap > table th,
.gbs-table-wrap > table td {
    border: 1px solid var(--gbs-table-border-cell);
    vertical-align: middle;
}

.gbs-table-wrap > table thead th {
    font-weight: 700;
    color: var(--gbs-table-head-color);
    background: var(--gbs-table-head-bg);
    border-color: var(--gbs-table-border);
    white-space: nowrap;
}

.gbs-table-wrap > table tbody tr:nth-child(even) td {
    background: var(--gbs-table-row-alt);
}

.gbs-table-wrap > table tbody tr:hover td {
    background: var(--gbs-table-row-hover);
}

/* Tailwind divide-y は格子線と重複するため無効化 */
.gbs-table-wrap > table tbody.divide-y > :not([hidden]) ~ :not([hidden]) {
    --tw-divide-y-reverse: 0;
    border-top-width: 0;
}

/* —— Monthly shift (page 1080) — Japanese-style sheet UI —— */
.gbs-shift-page {
    --gbs-shift-staff-left: 0px;
    --gbs-shift-timecard-left: 0px;
    --gbs-shift-radius: 0.875rem;
    --gbs-shift-border: rgba(74, 127, 184, 0.28);
    --gbs-shift-head: linear-gradient(180deg, #e8f2fc 0%, #f4f9ff 55%, #fafcff 100%);
    --gbs-shift-accent: #1e4a7a;
    --gbs-shift-accent-bright: #2563eb;
    --gbs-shift-accent-soft: #93c5fd;
    --gbs-shift-ink: #0f2744;
    --gbs-shift-muted: #475569;
    --gbs-shift-washi: #f8fbff;
    --gbs-shift-table-size: 0.9375rem;
    --gbs-shift-th-size: 0.8125rem;
    font-family: var(--gbs-jp-font);
    letter-spacing: var(--gbs-jp-tracking);
    line-height: var(--gbs-jp-leading);
}

.gbs-shift-page-card {
    position: relative;
    border-radius: var(--gbs-shift-radius);
    box-shadow:
        0 4px 24px -6px rgba(30, 74, 122, 0.18),
        0 0 0 1px rgba(255, 255, 255, 0.7) inset;
    border: 1px solid var(--gbs-shift-border);
    background:
        radial-gradient(circle at 100% 0%, rgba(147, 197, 253, 0.14) 0%, transparent 42%),
        radial-gradient(circle at 0% 100%, rgba(74, 127, 184, 0.1) 0%, transparent 38%),
        linear-gradient(165deg, #f0f7ff 0%, var(--gbs-shift-washi) 45%, #fafcff 100%);
    overflow: hidden;
}

.gbs-shift-page-card > .gbs-shift-command:first-child {
    margin: -0.75rem -0.75rem 0;
    border-radius: var(--gbs-shift-radius) var(--gbs-shift-radius) 0 0;
}

@media (min-width: 640px) {
    .gbs-shift-page-card > .gbs-shift-command:first-child {
        margin: -1rem -1rem 0;
    }
}

@media (min-width: 1024px) {
    .gbs-shift-page-card > .gbs-shift-command:first-child {
        margin: -1.25rem -1.25rem 0;
    }
}

.gbs-ss-v2__shell > .gbs-shift-command:first-child {
    margin: 0;
    border-radius: 0;
}

.gbs-shift-page-card::before {
    display: none;
}

.gbs-shift-year28__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: 0.75rem;
}

.gbs-shift-year28__filter {
    min-width: min(100%, 14rem);
}

.gbs-shift-year28__kpi {
    margin-bottom: 0.75rem;
}

.gbs-shift-year28__toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.gbs-shift-year28__row--over {
    background: rgba(254, 226, 226, 0.35);
}

.gbs-shift-year28__table th,
.gbs-shift-year28__table td {
    vertical-align: middle;
}

.gbs-shift-year28__filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    align-items: flex-end;
}

.gbs-shift-range-period {
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(74, 127, 184, 0.2);
    background: rgba(255, 255, 255, 0.65);
}

.gbs-shift-range-period__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.5rem;
}

.gbs-shift-range-period__row--month {
    margin-bottom: 0.35rem;
}

.gbs-shift-range-period__label {
    font-size: 0.75rem;
    font-weight: 700;
    color: #1e4a7a;
    min-width: 4.5rem;
}

.gbs-shift-range-period__label--sub {
    font-weight: 600;
    color: #475569;
}

.gbs-shift-range-period__dates {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
}

.gbs-shift-range-period__input {
    font-size: 0.8125rem;
    padding: 0.35rem 0.5rem;
}

.gbs-shift-range-period__sep {
    color: #64748b;
    font-weight: 600;
}

.gbs-shift-range-period__presets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.35rem;
}

.gbs-shift-range-period__preset {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #1e4a7a;
    text-decoration: none;
}

.gbs-shift-range-period__preset:hover {
    background: #eff6ff;
    border-color: #93c5fd;
}

/* Shift schedule — unified command bar */
.gbs-shift-command {
    padding: 1rem 1.25rem 0.85rem;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
    border-bottom: 1px solid rgba(74, 127, 184, 0.14);
}

.gbs-shift-command--v2 {
    padding: 0.95rem 1.15rem 0.75rem;
    background: linear-gradient(135deg, #eff6ff 0%, #f8fafc 55%, #fff 100%);
    border-bottom: 1px solid #e2e8f0;
}

.gbs-shift-command__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.25rem;
    margin-bottom: 0.75rem;
}

.gbs-shift-command__brand {
    flex: 1 1 14rem;
    min-width: 0;
}

.gbs-shift-command__title {
    margin: 0;
    font-size: 1.375rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: #0f172a;
    line-height: 1.25;
}

.gbs-shift-command__range-tag {
    display: inline-flex;
    align-items: center;
    margin-left: 0.5rem;
    padding: 0.15rem 0.55rem;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #1e40af;
    background: #dbeafe;
    border: 1px solid #93c5fd;
    border-radius: 999px;
    vertical-align: middle;
}

.gbs-shift-command__meta {
    margin: 0.3rem 0 0;
    font-size: 0.8125rem;
    color: #475569;
    line-height: 1.45;
}

.gbs-shift-command__meta--muted {
    color: #64748b;
    max-width: 36rem;
}

.gbs-shift-command__actions {
    flex: 0 1 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    min-width: 0;
}

.gbs-shift-command__tabs {
    margin: 0;
}

/* Shift nav — segmented tabs + monthly submenu */
.gbs-shift-nav {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.gbs-shift-nav__row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border: 1px solid rgba(74, 127, 184, 0.22);
    border-radius: 0.65rem;
    overflow: visible;
    background: #fff;
    box-shadow: 0 1px 4px rgb(15 23 42 / 0.05);
}

.gbs-shift-nav__cell {
    position: relative;
    border-right: 1px solid rgba(74, 127, 184, 0.12);
}

.gbs-shift-nav__cell:last-child,
.gbs-shift-nav__row > .gbs-shift-nav__tab:last-child {
    border-right: none;
}

.gbs-shift-nav__menu {
    position: relative;
    height: 100%;
}

.gbs-shift-nav__menu > summary {
    list-style: none;
}

.gbs-shift-nav__menu > summary::-webkit-details-marker {
    display: none;
}

.gbs-shift-nav__tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    min-height: 2.75rem;
    padding: 0.45rem 0.55rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #334155;
    text-decoration: none;
    text-align: center;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: background 0.14s ease, color 0.14s ease;
}

.gbs-shift-nav__tab:hover {
    background: #f8fbff;
    color: #1d4ed8;
    text-decoration: none;
}

.gbs-shift-nav__tab.is-active,
.gbs-shift-nav__cell.is-active > .gbs-shift-nav__menu > summary.gbs-shift-nav__tab {
    color: #fff;
    background: linear-gradient(145deg, #1e4a7a 0%, #2563eb 55%, #3b82f6 100%);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.18);
}

.gbs-shift-nav__tab.is-active:hover,
.gbs-shift-nav__cell.is-active > .gbs-shift-nav__menu > summary.gbs-shift-nav__tab:hover {
    color: #fff;
    background: linear-gradient(145deg, #2563eb 0%, #1d4ed8 100%);
}

.gbs-shift-nav__tab-main {
    line-height: 1.25;
}

.gbs-shift-nav__tab-chip {
    display: inline-flex;
    align-items: center;
    padding: 0.08rem 0.45rem;
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: #1e40af;
    background: rgb(255 255 255 / 0.92);
    border-radius: 999px;
}

.gbs-shift-nav__cell.is-active .gbs-shift-nav__tab-chip {
    color: #1e3a8a;
}

.gbs-shift-nav__caret {
    display: block;
    width: 0;
    height: 0;
    margin-top: 0.05rem;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    opacity: 0.65;
}

.gbs-shift-nav__panel {
    position: absolute;
    top: calc(100% + 0.35rem);
    left: 0.35rem;
    right: 0.35rem;
    z-index: 60;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    padding: 0.35rem;
    border-radius: 0.55rem;
    border: 1px solid #cbd5e1;
    background: #fff;
    box-shadow: 0 12px 32px rgb(15 23 42 / 0.14);
}

.gbs-shift-nav__panel-item {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding: 0.5rem 0.6rem;
    border-radius: 0.45rem;
    text-decoration: none;
    color: #334155;
    transition: background 0.12s ease, color 0.12s ease;
}

.gbs-shift-nav__panel-item:hover {
    background: #eff6ff;
    color: #1d4ed8;
    text-decoration: none;
}

.gbs-shift-nav__panel-item.is-active {
    background: #dbeafe;
    color: #1e40af;
}

.gbs-shift-nav__panel-title {
    font-size: 0.8125rem;
    font-weight: 800;
    line-height: 1.2;
}

.gbs-shift-nav__panel-desc {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.3;
}

.gbs-shift-nav__panel-item.is-active .gbs-shift-nav__panel-desc,
.gbs-shift-nav__panel-item:hover .gbs-shift-nav__panel-desc {
    color: inherit;
    opacity: 0.85;
}

.gbs-shift-nav__subbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.45rem;
    padding: 0.4rem 0.55rem;
    border-radius: 0.5rem;
    background: linear-gradient(180deg, #f0f7ff 0%, #f8fafc 100%);
    border: 1px solid #bfdbfe;
}

.gbs-shift-nav__subbar-label {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #64748b;
    text-transform: uppercase;
    margin-right: 0.15rem;
}

.gbs-shift-nav__sub-link {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.7rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #475569;
    text-decoration: none;
    border-radius: 999px;
    border: 1px solid transparent;
    transition: background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}

.gbs-shift-nav__sub-link:hover {
    color: #1d4ed8;
    background: #fff;
    border-color: #93c5fd;
    text-decoration: none;
}

.gbs-shift-nav__sub-link.is-active {
    color: #fff;
    background: linear-gradient(145deg, #2563eb 0%, #1d4ed8 100%);
    border-color: transparent;
    box-shadow: 0 1px 4px rgb(37 99 235 / 0.28);
}

.gbs-shift-command__tabs .gbs-screen-tabs__track {
    display: none;
}

/* Month navigation pill */
.gbs-shift-period-browse {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem 0.55rem;
}

.gbs-shift-month-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    padding: 0.2rem;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    box-shadow: 0 1px 4px rgb(15 23 42 / 0.06);
}

.gbs-shift-month-pill__nav {
    display: grid;
    place-items: center;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 999px;
    border: none;
    background: transparent;
    color: #475569;
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.12s ease, color 0.12s ease;
}

.gbs-shift-month-pill__nav:hover {
    background: #eff6ff;
    color: #1d4ed8;
    text-decoration: none;
}

.gbs-shift-month-pill__nav.is-disabled {
    opacity: 0.28;
    pointer-events: none;
}

.gbs-shift-month-pill__picker {
    min-width: 0;
}

.gbs-shift-month-pill__picker .gbs-shift-period-form {
    margin: 0;
}

.gbs-shift-month-pill__picker .gbs-sales-month-picker__field {
    border: none;
    background: transparent;
    box-shadow: none;
}

.gbs-shift-month-pill__picker .gbs-shift-period-picker__trigger {
    min-width: 8.5rem;
    padding: 0.35rem 0.55rem;
    font-size: 0.875rem;
    font-weight: 700;
    color: #0f172a;
    border: none;
    background: transparent;
    box-shadow: none;
}

.gbs-shift-month-pill__picker .gbs-shift-period-picker__trigger:hover {
    background: #f8fafc;
}

/* Export button group */
.gbs-shift-export-group {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 3px rgb(15 23 42 / 0.05);
}

.gbs-shift-export-group__label {
    display: inline-flex;
    align-items: center;
    padding: 0 0.55rem;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
    background: #f8fafc;
    border-right: 1px solid #e2e8f0;
}

.gbs-shift-export-group__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.38rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #334155;
    text-decoration: none;
    border-right: 1px solid #e2e8f0;
    white-space: nowrap;
    transition: background 0.12s ease, color 0.12s ease;
}

.gbs-shift-export-group__btn:last-child {
    border-right: none;
}

.gbs-shift-export-group__btn:hover {
    background: #eff6ff;
    color: #1d4ed8;
    text-decoration: none;
}

.gbs-shift-export-group__btn--accent {
    color: #1d4ed8;
    background: #f0f7ff;
}

.gbs-shift-export-group__btn--accent:hover {
    background: #dbeafe;
    color: #1e40af;
}

/* Multi-month range popover */
.gbs-shift-range-pop {
    position: relative;
}

.gbs-shift-range-pop__trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.25rem;
    padding: 0.38rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #64748b;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
    transition: border-color 0.12s ease, color 0.12s ease, background 0.12s ease;
}

.gbs-shift-range-pop__trigger::-webkit-details-marker {
    display: none;
}

.gbs-shift-range-pop__trigger:hover,
.gbs-shift-range-pop[open] > .gbs-shift-range-pop__trigger {
    color: #1d4ed8;
    border-color: #93c5fd;
    background: #eff6ff;
}

.gbs-shift-range-pop__form {
    position: absolute;
    top: calc(100% + 0.35rem);
    right: 0;
    z-index: 50;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    min-width: 16rem;
    padding: 0.55rem 0.65rem;
    border-radius: 0.55rem;
    border: 1px solid #cbd5e1;
    background: #fff;
    box-shadow: 0 10px 28px rgb(15 23 42 / 0.14);
}

.gbs-shift-range-pop__input {
    width: 7.5rem;
    font-size: 0.8125rem;
}

.gbs-shift-range-pop__sep {
    color: #94a3b8;
    font-weight: 700;
}

.gbs-shift-range-pop__apply {
    padding: 0.35rem 0.7rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #fff;
    background: #2563eb;
    border: none;
    border-radius: 0.4rem;
    cursor: pointer;
    white-space: nowrap;
}

.gbs-shift-range-pop__apply:hover {
    background: #1d4ed8;
}

@media (max-width: 768px) {
    .gbs-shift-command__head {
        flex-direction: column;
        align-items: stretch;
    }

    .gbs-shift-command__actions {
        justify-content: flex-start;
    }

    .gbs-shift-period-browse {
        justify-content: flex-start;
    }

    .gbs-shift-command__tabs .gbs-shift-nav__row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gbs-shift-nav__cell {
        border-bottom: 1px solid rgba(74, 127, 184, 0.12);
    }

    .gbs-shift-nav__row > .gbs-shift-nav__tab:nth-child(3),
    .gbs-shift-nav__row > .gbs-shift-nav__tab:nth-child(4) {
        border-bottom: none;
    }
}

/* Monthly shift — month-range browse (legacy aliases) */
.gbs-shift-period-browse__toolbar,
.gbs-shift-period-browse__month-nav {
    display: contents;
}

.gbs-shift-period-form--compact {
    margin: 0;
}

.gbs-shift-period-form--compact .gbs-shift-period-picker__trigger {
    min-width: 9rem;
}

.gbs-shift-period-browse__range-details {
    width: 100%;
}

.gbs-shift-period-browse__range-summary {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #64748b;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.gbs-shift-period-browse__range-summary::-webkit-details-marker {
    display: none;
}

.gbs-shift-period-browse__range-summary::before {
    content: "▸";
    font-size: 0.65rem;
    transition: transform 0.15s ease;
}

.gbs-shift-period-browse__range-details[open] > .gbs-shift-period-browse__range-summary::before {
    transform: rotate(90deg);
}

.gbs-shift-period-browse__range-details[open] > .gbs-shift-period-browse__range-summary {
    color: #1d4ed8;
    margin-bottom: 0.35rem;
}

.gbs-shift-period-browse__range-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.55rem;
    border-radius: 0.5rem;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.gbs-shift-export-menu {
    position: relative;
    flex-shrink: 0;
}

.gbs-shift-export-menu__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.38rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #1d4ed8;
    background: #fff;
    border: 1px solid #93c5fd;
    border-radius: 0.45rem;
    cursor: pointer;
    list-style: none;
    white-space: nowrap;
    transition: background 0.12s ease, border-color 0.12s ease;
}

.gbs-shift-export-menu__trigger::-webkit-details-marker {
    display: none;
}

.gbs-shift-export-menu__trigger::after {
    content: "▾";
    font-size: 0.7rem;
    opacity: 0.7;
}

.gbs-shift-export-menu__trigger:hover,
.gbs-shift-export-menu[open] > .gbs-shift-export-menu__trigger {
    background: #eff6ff;
    border-color: #60a5fa;
}

.gbs-shift-export-menu__panel {
    position: absolute;
    top: calc(100% + 0.25rem);
    right: 0;
    z-index: 40;
    min-width: 10rem;
    padding: 0.3rem;
    border-radius: 0.5rem;
    border: 1px solid #cbd5e1;
    background: #fff;
    box-shadow: 0 8px 24px rgb(15 23 42 / 0.12);
}

.gbs-shift-export-menu__item {
    display: block;
    padding: 0.45rem 0.65rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    text-decoration: none;
    border-radius: 0.35rem;
    white-space: nowrap;
}

.gbs-shift-export-menu__item:hover {
    background: #eff6ff;
    color: #1d4ed8;
    text-decoration: none;
}

.gbs-shift-period-browse__range-form {
    width: 100%;
}

.gbs-shift-period-browse__range-card {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    width: 100%;
    padding: 0.55rem 0.7rem;
    border-radius: 0.65rem;
    border: 1px solid #c7d9f0;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
    box-shadow: 0 2px 8px rgb(37 99 235 / 0.06);
}

.gbs-shift-period-browse__range-form,
.gbs-shift-period-browse__view-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0.45rem 0.65rem;
    width: 100%;
}

.gbs-shift-period-browse__label {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #475569;
    white-space: nowrap;
}

.gbs-shift-period-browse__label--sub {
    color: #64748b;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 700;
}

.gbs-shift-period-browse__viewing {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.gbs-shift-period-browse__viewing-value {
    font-size: 1.05rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: 0.01em;
    line-height: 1.2;
}

.gbs-shift-viewing-month {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin: 0.75rem 0 0.85rem;
    padding: 0.7rem 0.95rem;
    border: 2px solid #3b82f6;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #eff6ff 0%, #fff 100%);
    box-shadow: 0 4px 14px rgb(37 99 235 / 0.12);
}

.gbs-shift-viewing-month__main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.65rem;
}

.gbs-shift-viewing-month__label {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-shift-viewing-month__value {
    font-size: 1.125rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.2;
}

.gbs-shift-viewing-month__status {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.55rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #1d4ed8;
    background: #dbeafe;
    border: 1px solid #93c5fd;
}

.gbs-shift-viewing-month__status.is-editing {
    color: #fff;
    background: linear-gradient(135deg, #1e4a7a 0%, #2563eb 100%);
    border-color: #1d4ed8;
}

.gbs-shift-viewing-month__range {
    margin: 0;
    font-size: 0.75rem;
    color: #64748b;
}

.gbs-shift-period-badge-range,
.gbs-ss-v2__badge-range {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.7rem;
    font-size: 0.6875rem;
    font-weight: 700;
    color: #1e40af;
    background: #dbeafe;
    border: 1px solid #93c5fd;
    border-radius: 9999px;
}

.gbs-shift-page-header__title-row,
.gbs-ss-v2__title-row {
    flex-wrap: wrap;
}

.gbs-shift-period-browse__inputs,
.gbs-shift-period-browse__view-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    flex: 1;
    min-width: 0;
    justify-content: flex-end;
}

.gbs-shift-period-browse__input {
    width: 8.75rem;
    font-size: 0.8125rem;
    border-color: #cbd5e1;
    background: #fff;
}

.gbs-shift-period-browse__input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgb(37 99 235 / 0.12);
}

.gbs-shift-period-browse__sep {
    color: #64748b;
    font-weight: 800;
    padding: 0 0.1rem;
}

.gbs-shift-period-browse__apply {
    padding: 0.38rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(180deg, #2563eb 0%, #1d4ed8 100%);
    border: 1px solid #1e40af;
    border-radius: 0.45rem;
    box-shadow: 0 2px 6px rgb(37 99 235 / 0.25);
    cursor: pointer;
    white-space: nowrap;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.gbs-shift-period-browse__apply:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgb(37 99 235 / 0.3);
}

.gbs-shift-period-browse__apply:active {
    transform: translateY(0);
}

.gbs-shift-period-browse__export {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.38rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #1d4ed8;
    background: #fff;
    border: 1px solid #93c5fd;
    border-radius: 0.45rem;
    box-shadow: 0 1px 4px rgb(37 99 235 / 0.1);
    text-decoration: none;
    white-space: nowrap;
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
}

.gbs-shift-period-browse__export:hover {
    background: #eff6ff;
    color: #1e40af;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgb(37 99 235 / 0.16);
}

.gbs-shift-period-browse__export--compact {
    padding: 0.3rem 0.65rem;
    font-size: 0.75rem;
}

.gbs-shift-period-browse__export--preview {
    color: #475569;
    background: #f8fafc;
    border-color: #cbd5e1;
}

.gbs-shift-period-browse__export--preview:hover {
    color: #1e293b;
    background: #f1f5f9;
    border-color: #94a3b8;
}

.gbs-shift-period-browse__nav {
    display: grid;
    place-items: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 999px;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #334155;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    flex-shrink: 0;
}

.gbs-shift-period-browse__nav:hover {
    border-color: #93c5fd;
    background: #eff6ff;
    color: #1d4ed8;
    text-decoration: none;
}

.gbs-shift-period-browse__nav.is-disabled {
    opacity: 0.35;
    pointer-events: none;
}

/* Monthly shift — month-range compact tile cards (3-up grid) */
.gbs-shift-month-cards {
    width: 100%;
}

.gbs-shift-month-cards--panel {
    margin: 0 0 0.85rem;
    padding: 0.75rem 0.85rem 0.85rem;
    border-radius: 0.75rem;
    border: 1px solid #bfdbfe;
    background: linear-gradient(180deg, #f8fbff 0%, #eff6ff 100%);
    box-shadow: 0 2px 10px rgb(37 99 235 / 0.08);
}

.gbs-shift-month-cards__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.55rem 0.75rem;
    margin-bottom: 0.65rem;
}

.gbs-shift-month-cards__head-main {
    flex: 1 1 12rem;
    min-width: 0;
}

.gbs-shift-month-cards__title {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #1e3a8a;
}

.gbs-shift-month-cards__intro {
    margin: 0.2rem 0 0;
    font-size: 0.75rem;
    color: #475569;
    line-height: 1.45;
}

.gbs-shift-month-cards__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    width: 100%;
}

.gbs-shift-month-panel {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    padding: 0;
    border-radius: 0.7rem;
    border: 1px solid #cbd5e1;
    background: #fff;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 2px 8px rgb(15 23 42 / 0.06);
    overflow: hidden;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.gbs-shift-month-panel--tile {
    aspect-ratio: 1;
    max-width: 100%;
}

.gbs-shift-month-panel:hover {
    border-color: #60a5fa;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgb(37 99 235 / 0.12);
}

.gbs-shift-month-panel.is-active {
    border-color: #2563eb;
    box-shadow: 0 0 0 2px rgb(37 99 235 / 0.2), 0 6px 18px rgb(37 99 235 / 0.14);
}

.gbs-ss-v2__month-editor {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid #e2e8f0;
}

.gbs-ss-v2__month-editor-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}

.gbs-ss-v2__month-editor-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: #0f172a;
}

.gbs-ss-v2__month-editor-hint {
    margin: 0;
    font-size: 0.75rem;
    color: #64748b;
}

.gbs-shift-month-panel.is-editing {
    cursor: default;
    transform: none;
}

.gbs-shift-month-panel.is-editing:hover {
    transform: none;
    border-color: #2563eb;
}

.gbs-shift-month-panel.is-editing .gbs-shift-month-panel__badge {
    background: #fef3c7;
    color: #92400e;
    border-color: #fcd34d;
}

.gbs-shift-month-panel__editor {
    padding: 0.75rem;
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.gbs-shift-month-panel__editor .gbs-ss-v2__main {
    min-height: 0;
}

.gbs-shift-month-panel__editor .gbs-ss-v2__grid-shell {
    max-height: min(70vh, 720px);
}

.gbs-shift-month-panel__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.35rem;
    flex-shrink: 0;
    padding: 0.45rem 0.55rem;
    background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
    border-bottom: 1px solid #bfdbfe;
}

.gbs-shift-month-panel.is-active .gbs-shift-month-panel__top {
    background: linear-gradient(180deg, #3b82f6 0%, #2563eb 100%);
    border-bottom-color: #1d4ed8;
    color: #fff;
}

.gbs-shift-month-panel__title {
    display: block;
    min-width: 0;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.2;
    color: #0f172a;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-shift-month-panel.is-active .gbs-shift-month-panel__title {
    color: #fff;
}

.gbs-shift-month-panel__badge {
    flex-shrink: 0;
    padding: 0.15rem 0.45rem;
    font-size: 0.5625rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    border-radius: 999px;
    background: #fff;
    color: #1d4ed8;
    border: 1px solid #93c5fd;
    line-height: 1.2;
}

.gbs-shift-month-panel.is-active .gbs-shift-month-panel__badge {
    background: rgb(255 255 255 / 0.18);
    color: #fff;
    border-color: rgb(255 255 255 / 0.35);
}

.gbs-shift-month-tile__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    padding: 0.4rem 0.45rem 0.45rem;
    background: #f8fafc;
}

.gbs-shift-month-tile__cal {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.gbs-shift-month-tile__dow-row,
.gbs-shift-month-tile__days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.12rem;
}

.gbs-shift-month-tile__dow {
    display: grid;
    place-items: center;
    font-size: 0.5rem;
    font-weight: 800;
    color: #94a3b8;
    text-transform: uppercase;
    line-height: 1;
}

.gbs-shift-month-tile__cell {
    display: grid;
    place-items: center;
    aspect-ratio: 1;
    min-width: 0;
    border-radius: 0.2rem;
    border: 1px solid #e2e8f0;
    background: #fff;
    color: #64748b;
}

.gbs-shift-month-tile__cell.is-empty {
    visibility: hidden;
    border-color: transparent;
    background: transparent;
}

.gbs-shift-month-tile__cell.is-weekend {
    background: #f5f3ff;
    border-color: #ddd6fe;
    color: #6d28d9;
}

.gbs-shift-month-tile__cell.is-today {
    border-color: #2563eb;
    box-shadow: inset 0 0 0 1px #2563eb;
    color: #1d4ed8;
    font-weight: 800;
}

.gbs-shift-month-tile__cell.has-staff {
    background: #ecfdf5;
    border-color: #bbf7d0;
    color: #166534;
}

.gbs-shift-month-tile__cell.has-hours {
    background: #ffe4e6;
    border-color: #fecdd3;
    color: #be123c;
    font-weight: 800;
}

.gbs-shift-month-tile__cell-num {
    font-size: clamp(0.45rem, 1.6vw, 0.5625rem);
    font-weight: 700;
    line-height: 1;
}

.gbs-shift-month-tile__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.2rem;
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px solid #e2e8f0;
}

.gbs-shift-month-tile__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.05rem;
    min-width: 0;
    text-align: center;
}

.gbs-shift-month-tile__stat-label {
    font-size: 0.5rem;
    font-weight: 700;
    color: #94a3b8;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

.gbs-shift-month-tile__stat-value {
    font-size: 0.6875rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.1;
}

.gbs-shift-month-tile__stat-value.is-accent {
    color: #be123c;
}

.gbs-shift-month-tile__empty {
    display: grid;
    place-items: center;
    flex: 1 1 auto;
    padding: 0.75rem;
    font-size: 0.6875rem;
    color: #64748b;
    text-align: center;
    background: #f8fafc;
}

.gbs-shift-month-cards__warn {
    margin: 0.55rem 0 0;
    grid-column: 1 / -1;
    width: 100%;
    font-size: 0.6875rem;
    color: #92400e;
    text-align: right;
}

.gbs-ss-v2 .gbs-shift-month-cards--panel {
    margin: 0 1rem 0.85rem;
}

@media (max-width: 639px) {
    .gbs-shift-month-cards__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.55rem;
    }
}

@media (max-width: 399px) {
    .gbs-shift-month-cards__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gbs-shift-month-panel--tile {
        aspect-ratio: auto;
        max-width: 16rem;
        margin-inline: auto;
    }
}

@media (min-width: 1024px) {
    .gbs-shift-month-cards__grid {
        gap: 0.75rem;
    }

    .gbs-shift-month-panel__title {
        font-size: 0.8125rem;
    }
}

.gbs-ss-v2__period .gbs-shift-period-browse {
    align-items: stretch;
    min-width: 0;
}

.gbs-ss-v2__period .gbs-shift-period-browse__toolbar {
    justify-content: flex-start;
}

.gbs-ss-v2__period .gbs-shift-period-browse__range-row {
    background: rgb(255 255 255 / 0.7);
    border-color: #bfdbfe;
}

.gbs-ss-v2__period .gbs-shift-month-cards__warn {
    text-align: left;
}

.gbs-ss-v2__period .gbs-shift-period-form {
    margin: 0;
}

.gbs-ss-v2__period .gbs-shift-period-picker__label {
    display: none;
}

/* Compact page header */
.gbs-shift-page-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: 1.125rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-shift-page-header__main {
    flex: 1 1 12rem;
    min-width: 0;
}

.gbs-shift-page-header__title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
}

.gbs-shift-page-title {
    margin: 0;
    font-size: 1.75rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--gbs-shift-ink);
    line-height: var(--gbs-jp-leading-heading);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

.gbs-shift-page-intro {
    margin: 0.5rem 0 0;
    font-size: 1rem;
    color: var(--gbs-shift-muted);
    line-height: 1.65;
    max-width: 42rem;
}

.gbs-shift-period-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 1rem;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #fff;
    background: linear-gradient(135deg, #1e4a7a 0%, #2563eb 50%, #3b82f6 100%);
    border: none;
    border-radius: 9999px;
    box-shadow: 0 3px 10px rgba(37, 99, 235, 0.35);
}

.gbs-shift-period-filter form {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.5rem 0.75rem;
    padding: 0.75rem 1rem;
    background: linear-gradient(135deg, #fff 0%, #eff6ff 100%);
    border: 2px solid rgba(74, 127, 184, 0.25);
    border-radius: var(--gbs-shift-radius);
    box-shadow: 0 2px 8px rgba(30, 74, 122, 0.08);
}

/* Selector */
.gbs-shift-selector {
    margin-bottom: 1rem;
    padding: 1rem 1.15rem;
    background: linear-gradient(135deg, #fff 0%, #f0f7ff 100%);
    border: 2px solid rgba(74, 127, 184, 0.22);
    border-radius: var(--gbs-shift-radius);
    box-shadow: 0 3px 14px -4px rgba(30, 74, 122, 0.12);
}

.gbs-shift-selector__form {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

@media (min-width: 1024px) {
    .gbs-shift-selector__form {
        flex-direction: row;
        align-items: flex-end;
    }
}

.gbs-shift-selector__field {
    flex: 1 1 12rem;
    min-width: 0;
}

.gbs-shift-selector__label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.9375rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--gbs-shift-accent);
}

.gbs-shift-selector__input {
    min-height: 3.125rem;
    border-radius: 0.5rem;
    font-size: 1.0625rem;
    font-weight: 700;
    color: var(--gbs-shift-ink);
    border: 2px solid rgba(74, 127, 184, 0.3);
    background: #fff;
}

.gbs-shift-selector__input:focus {
    border-color: var(--gbs-brand);
    box-shadow: 0 0 0 3px var(--gbs-accent-dim);
}

.gbs-shift-selector--loading {
    opacity: 0.72;
    pointer-events: none;
}

.gbs-shift-selector--loading .gbs-shift-selector__input {
    cursor: wait;
}

.gbs-shift-content--loading {
    opacity: 0.55;
    pointer-events: none;
    min-height: 12rem;
}

.gbs-shift-selector__hint {
    margin-top: 0.65rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--gbs-shift-muted);
}

/* Dash bar — owners + KPI in one row */
.gbs-shift-dash {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
    background: linear-gradient(135deg, #fff 0%, #eef6ff 100%);
    border: 2px solid rgba(74, 127, 184, 0.2);
    border-radius: var(--gbs-shift-radius);
    box-shadow: 0 4px 16px -6px rgba(30, 74, 122, 0.14);
}

.gbs-shift-dash .gbs-shift-owners--inline {
    flex: 1 1 14rem;
    min-width: 0;
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
}

.gbs-shift-dash .gbs-shift-sales-forecast {
    flex: 0 0 auto;
    align-self: stretch;
}

.gbs-shift-dash .gbs-shift-kpi-strip {
    flex: 1 1 20rem;
    margin: 0;
}

/* KPI strip */
.gbs-shift-kpi-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
}

@media (min-width: 768px) {
    .gbs-shift-kpi-strip {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.gbs-shift-kpi {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0.75rem 0.85rem;
    background: #fff;
    border: 1px solid rgba(74, 127, 184, 0.18);
    border-radius: 0.625rem;
    box-shadow: none;
}

.gbs-shift-kpi:hover {
    box-shadow: none;
}

.gbs-shift-kpi__label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: var(--gbs-shift-accent);
    margin-bottom: 0.3rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-shift-kpi__value {
    font-size: 1.75rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--gbs-shift-ink);
    line-height: 1.1;
}

.gbs-shift-kpi__value small {
    font-size: 0.9375rem;
    font-weight: 700;
    opacity: 0.8;
}

.gbs-shift-kpi__value--accent {
    color: #2563eb;
}

.gbs-shift-kpi__value--warn {
    color: #dc2626;
}

.gbs-shift-kpi__value--sm {
    font-size: 1.0625rem;
    font-weight: 800;
}

/* 売り上げ予測 — テンプレv1 C102:C104 */
.gbs-shift-sales-forecast {
    flex: 0 0 auto;
    min-width: 12rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.5rem;
    border: 1px solid #dbeafe;
    background: linear-gradient(180deg, #f8fbff 0%, #f1f5f9 100%);
}

.gbs-shift-sales-forecast__title {
    margin: 0 0 0.45rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #1e3a5f;
    letter-spacing: 0.02em;
}

.gbs-shift-sales-forecast__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8125rem;
}

.gbs-shift-sales-forecast__table th {
    padding: 0.2rem 0.75rem 0.2rem 0;
    font-weight: 600;
    color: #475569;
    text-align: left;
    white-space: nowrap;
}

.gbs-shift-sales-forecast__table td {
    padding: 0.2rem 0;
}

.gbs-shift-sales-forecast__val {
    font-variant-numeric: tabular-nums;
    font-weight: 700;
    color: #0f172a;
    text-align: right;
    white-space: nowrap;
}

.gbs-shift-sales-forecast__val--accent {
    color: #1d4ed8;
    font-size: 0.9375rem;
}

.gbs-shift-sales-forecast__hint {
    margin: 0.45rem 0 0;
    font-size: 0.6875rem;
    line-height: 1.4;
    color: #64748b;
}

/* Workspace */
.gbs-shift-workspace {
    animation: gbs-fade-up 0.4s ease-out both;
}

.gbs-shift-sheet-card {
    border: 2px solid rgba(74, 127, 184, 0.22);
    border-radius: var(--gbs-shift-radius);
    overflow: hidden;
    background: #fff;
    box-shadow: 0 6px 28px -8px rgba(30, 74, 122, 0.2);
}

/* Template head */
.gbs-shift-template-head {
    background: var(--gbs-shift-head);
    border-bottom: 1px solid var(--gbs-shift-border);
}

.gbs-shift-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border-bottom: 1px solid var(--gbs-shift-border);
}

@media (min-width: 768px) {
    .gbs-shift-meta-grid {
        grid-template-columns: 1fr 1fr 2fr auto;
    }
}

.gbs-shift-meta-tile {
    padding: 0.85rem 1rem;
    border-right: 1px solid rgba(74, 127, 184, 0.15);
    border-bottom: 1px solid rgba(74, 127, 184, 0.12);
    background: rgba(255, 255, 255, 0.55);
}

@media (min-width: 768px) {
    .gbs-shift-meta-tile {
        border-bottom: none;
    }
}

.gbs-shift-meta-tile--wide {
    grid-column: span 2;
}

@media (min-width: 768px) {
    .gbs-shift-meta-tile--wide {
        grid-column: auto;
    }
}

.gbs-shift-meta-tile--limit {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.35rem;
}

@media (min-width: 768px) {
    .gbs-shift-meta-tile--limit {
        align-items: flex-end;
        border-right: none;
    }
}

.gbs-shift-meta-tile__label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--gbs-shift-accent);
    margin-bottom: 0.25rem;
}

.gbs-shift-meta-tile__value {
    font-size: 1.125rem;
    font-weight: 800;
    color: var(--gbs-shift-ink);
    line-height: 1.45;
    word-break: break-word;
}

.gbs-shift-meta-tile__value--mono {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1.25rem;
    color: #2563eb;
}

.gbs-shift-pic-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    border-bottom: 1px solid var(--gbs-shift-border);
    background: rgba(255, 255, 255, 0.65);
}

@media (min-width: 640px) {
    .gbs-shift-pic-row {
        grid-template-columns: 1fr 1fr;
    }
}

.gbs-shift-pic-item {
    padding: 0.75rem 1rem;
    border-right: 1px solid rgba(148, 163, 184, 0.15);
}

.gbs-shift-pic-item:last-child {
    border-right: none;
}

.gbs-shift-pic-item__role {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--gbs-ud-blue);
    margin-bottom: 0.15rem;
}

.gbs-shift-pic-item__name {
    font-size: 0.875rem;
    font-weight: 700;
    color: #0f172a;
    text-decoration: none;
}

a.gbs-shift-pic-item__name:hover {
    color: var(--gbs-ud-blue);
    text-decoration: underline;
}

.gbs-shift-pic-item__sub {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.6875rem;
    color: #64748b;
}

/* Collapsible legend */
.gbs-shift-legend-wrap {
    border-bottom: 1px solid var(--gbs-shift-border);
}

.gbs-shift-legend-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1rem;
    font-size: 0.9375rem;
    font-weight: 800;
    color: var(--gbs-shift-accent);
    cursor: pointer;
    list-style: none;
    background: rgba(255, 255, 255, 0.85);
    user-select: none;
}

.gbs-shift-legend-toggle::-webkit-details-marker {
    display: none;
}

.gbs-shift-legend-toggle::before {
    content: '▸';
    font-size: 0.75rem;
    transition: transform 0.15s ease;
}

.gbs-shift-legend-wrap[open] .gbs-shift-legend-toggle::before {
    transform: rotate(90deg);
}

.gbs-shift-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    padding: 0.5rem 0.75rem 0.65rem;
    background: #f8f6f2;
    font-size: 0.8125rem;
    line-height: 1.55;
    color: var(--gbs-shift-muted);
}

.gbs-shift-legend__item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.gbs-shift-legend__item--warn {
    font-weight: 600;
}

.gbs-shift-legend__dot {
    width: 0.625rem;
    height: 0.625rem;
    border-radius: 2px;
    flex-shrink: 0;
}

.gbs-shift-legend__dot--derived {
    background: #dcfce7;
    box-shadow: inset 0 0 0 1px #86efac;
}

.gbs-shift-legend__dot--dow {
    background: linear-gradient(135deg, var(--gbs-ud-blue) 0%, #4a7fb8 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.gbs-shift-notes-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
    padding: 0.85rem 1rem 1rem;
    background: #fff;
}

@media (min-width: 768px) {
    .gbs-shift-notes-row {
        grid-template-columns: 1.4fr 1fr;
        align-items: start;
    }
}

.gbs-shift-notes-field {
    display: block;
}

.gbs-shift-notes-input {
    margin-top: 0.35rem;
    width: 100%;
    min-height: 2.75rem;
    font-size: 0.8125rem;
    border-radius: 0.5rem;
    resize: vertical;
}

.gbs-shift-notes-side {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    justify-content: center;
}

.gbs-shift-check {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    cursor: pointer;
}

.gbs-shift-check--cell {
    justify-content: center;
    margin: 0 auto;
    padding: 0.1rem;
}

.gbs-shift-check--cell input[type="checkbox"] {
    width: 1.125rem;
    height: 1.125rem;
    accent-color: var(--gbs-ud-blue);
    cursor: pointer;
}

.gbs-shift-td--announce {
    text-align: center;
    vertical-align: middle;
}

.gbs-shift-th--announce,
.gbs-shift-col-announce {
    min-width: 3.25rem;
    max-width: 4.5rem;
}

.gbs-shift-th--remarks,
.gbs-shift-col-remarks {
    min-width: 4.5rem;
}

.gbs-input--remarks {
    min-width: 4rem;
}

.gbs-shift-headcount-field {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.gbs-shift-headcount-input {
    width: 4.5rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
    border-radius: 0.5rem;
}

.gbs-shift-limit-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 3.25rem;
    padding: 0.4rem 0.85rem;
    font-size: 1.25rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, #1e4a7a 0%, #2563eb 100%);
    border: none;
    border-radius: 9999px;
    line-height: 1.2;
    box-shadow: 0 3px 10px rgba(37, 99, 235, 0.3);
}

.gbs-shift-over-demo {
    display: inline-block;
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 0.125rem;
    background: #fef2f2;
    box-shadow: inset 0 0 0 2px rgb(220 38 38 / 0.85);
    flex-shrink: 0;
}

/* Owners */
.gbs-shift-owners {
    margin-bottom: 0.75rem;
    padding: 0.55rem 0.75rem;
    background: #fff;
    border: 1px solid var(--gbs-shift-border);
    border-radius: var(--gbs-shift-radius);
}

.gbs-shift-owners--inline {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem 0.65rem;
}

.gbs-shift-owners__title {
    font-size: 0.9375rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: var(--gbs-shift-accent);
    white-space: nowrap;
}

.gbs-shift-owners--inline .gbs-shift-owners__title {
    margin: 0;
}

.gbs-shift-owners__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.gbs-shift-owner-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 0.85rem;
    background: linear-gradient(135deg, #fff 0%, #eff6ff 100%);
    border: 2px solid rgba(74, 127, 184, 0.25);
    border-radius: 9999px;
    font-size: 0.9375rem;
    transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.gbs-shift-owner-chip:hover {
    background: #fff;
    border-color: #2563eb;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15);
}

.gbs-shift-owner-chip__role {
    font-size: 0.8125rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, #1e4a7a 0%, #2563eb 100%);
    padding: 0.15rem 0.5rem;
    border-radius: 9999px;
    white-space: nowrap;
}

.gbs-shift-owner-chip__name {
    font-weight: 700;
    color: var(--gbs-shift-ink);
    text-decoration: none;
}

a.gbs-shift-owner-chip__name:hover {
    color: var(--gbs-ud-blue);
    text-decoration: underline;
}

/* Grid shell — scroll performance */
.gbs-shift-grid-shell {
    position: relative;
    border-top: 1px solid var(--gbs-shift-border);
}

.gbs-shift-grid-shell::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 0.5rem;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.08), transparent);
    opacity: 0;
    pointer-events: none;
    z-index: 25;
    transition: opacity 0.2s ease;
}

.gbs-shift-grid-shell--scrolled::before {
    opacity: 1;
}

.gbs-shift-grid-wrap.gbs-table-wrap {
    max-height: min(78vh, 48rem);
    overflow: auto;
    border: none;
    border-radius: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(74, 127, 184, 0.45) transparent;
}

.gbs-shift-grid-wrap::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.gbs-shift-grid-wrap::-webkit-scrollbar-thumb {
    background: rgba(74, 127, 184, 0.4);
    border-radius: 9999px;
}

/* Table — larger Japanese-style grid */
.gbs-shift-template {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--gbs-shift-table-size);
    background: #fff;
}

.gbs-shift-th,
.gbs-shift-td {
    border: 1px solid var(--gbs-table-border-cell);
    vertical-align: middle;
    padding: 0.45rem 0.55rem;
    white-space: nowrap;
    box-sizing: border-box;
}

.gbs-shift-th {
    position: sticky;
    top: 0;
    z-index: 20;
    font-weight: 800;
    font-size: var(--gbs-shift-th-size);
    letter-spacing: 0.05em;
    color: #0f2744;
    background: linear-gradient(180deg, #dceaf5 0%, #c8dff0 100%);
    border-color: var(--gbs-table-border);
    box-shadow: 0 2px 0 var(--gbs-table-border);
    overflow: visible;
    box-sizing: border-box;
}

.gbs-shift-th--resizable {
    position: sticky;
}

.gbs-shift-template[data-gbs-shift-table] .gbs-shift-th,
.gbs-shift-template[data-gbs-shift-table] .gbs-shift-td {
    min-width: 0;
    max-width: none;
}

.gbs-shift-th__label {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 0.5rem;
    line-height: 1.35;
}

.gbs-shift-col-resize {
    position: absolute;
    top: 0;
    right: -6px;
    width: 14px;
    height: 100%;
    cursor: col-resize;
    z-index: 60;
    touch-action: none;
    pointer-events: auto;
}

.gbs-shift-col-resize::after {
    content: '';
    position: absolute;
    top: 12%;
    bottom: 12%;
    left: 50%;
    width: 3px;
    margin-left: -1.5px;
    border-radius: 2px;
    background: rgba(74, 127, 184, 0.35);
    transition: background 0.15s ease, width 0.15s ease;
}

.gbs-shift-col-resize:hover::after,
.gbs-shift-col-resize--active::after {
    background: rgba(74, 127, 184, 0.75);
}

.gbs-shift-col-resize:hover,
.gbs-shift-col-resize--active {
    background: rgba(74, 127, 184, 0.12);
}

body.gbs-shift-col-resizing {
    cursor: col-resize !important;
    user-select: none;
}

body.gbs-shift-col-resizing * {
    cursor: col-resize !important;
}

.gbs-shift-th--workdays,
.gbs-shift-td--workdays {
    min-width: 10.5rem;
}

.gbs-shift-th--timerange,
.gbs-shift-td--timerange {
    min-width: 12.5rem;
}

.gbs-shift-td--timerange {
    padding: 0.35rem 0.5rem;
    vertical-align: middle;
}

/* —— Mini time range bar (Start – End drag) —— */
.gbs-time-range {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 11.5rem;
    user-select: none;
    -webkit-user-select: none;
}

.gbs-time-range__labels {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.gbs-time-range__time {
    color: #1e4a7a;
    cursor: default;
}

.gbs-time-range__time--start {
    text-align: left;
}

.gbs-time-range__time--end {
    text-align: right;
}

.gbs-time-range:not(.gbs-time-range--readonly) .gbs-time-range__time {
    cursor: pointer;
}

.gbs-time-range:not(.gbs-time-range--readonly) .gbs-time-range__time:hover {
    color: #2563eb;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.gbs-time-range__duration {
    font-size: 0.6875rem;
    font-weight: 700;
    color: #64748b;
    text-align: center;
    white-space: nowrap;
}

.gbs-time-range--active .gbs-time-range__duration {
    color: #2563eb;
}

.gbs-time-range--empty .gbs-time-range__time,
.gbs-time-range--empty .gbs-time-range__duration {
    color: #94a3b8;
}

.gbs-time-range__track {
    position: relative;
    height: 1.375rem;
    border-radius: 9999px;
    background: linear-gradient(180deg, #e8f0fa 0%, #dce8f5 100%);
    border: 1.5px solid rgba(74, 127, 184, 0.28);
    box-shadow: inset 0 1px 2px rgba(30, 74, 122, 0.08);
}

.gbs-time-range__fill {
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 0;
    width: 0;
    border-radius: 9999px;
    background: linear-gradient(90deg, #93c5fd 0%, #2563eb 55%, #1e4a7a 100%);
    box-shadow: 0 1px 4px rgba(37, 99, 235, 0.35);
    cursor: grab;
    transition: opacity 0.15s ease;
}

.gbs-time-range--empty .gbs-time-range__fill {
    opacity: 0.45;
}

.gbs-time-range--dragging .gbs-time-range__fill {
    cursor: grabbing;
    opacity: 1;
}

.gbs-time-range__handle {
    position: absolute;
    top: 50%;
    width: 1.125rem;
    height: 1.125rem;
    margin: 0;
    padding: 0;
    border: 2.5px solid #fff;
    border-radius: 9999px;
    background: linear-gradient(135deg, #2563eb 0%, #1e4a7a 100%);
    box-shadow:
        0 0 0 1px rgba(30, 74, 122, 0.35),
        0 2px 6px rgba(37, 99, 235, 0.45);
    transform: translate(-50%, -50%);
    cursor: grab;
    touch-action: none;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.gbs-time-range__handle:hover {
    transform: translate(-50%, -50%) scale(1.12);
    box-shadow:
        0 0 0 2px rgba(37, 99, 235, 0.35),
        0 3px 10px rgba(37, 99, 235, 0.5);
}

.gbs-time-range--dragging .gbs-time-range__handle,
.gbs-time-range__handle:active {
    cursor: grabbing;
    transform: translate(-50%, -50%) scale(1.18);
}

.gbs-time-range--readonly .gbs-time-range__track {
    opacity: 0.85;
}

.gbs-time-range--readonly .gbs-time-range__fill {
    cursor: default;
}

@media (max-width: 639px) {
    .gbs-shift-th--timerange,
    .gbs-shift-td--timerange {
        min-width: 11rem;
    }

    .gbs-time-range__handle {
        width: 1.375rem;
        height: 1.375rem;
    }

    .gbs-time-range__track {
        height: 1.625rem;
    }
}

.gbs-shift-dow-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.22rem;
    align-items: center;
    justify-content: flex-start;
    padding: 0.15rem 0.1rem;
}

.gbs-shift-dow-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.125rem;
    height: 2.125rem;
    padding: 0 0.45rem;
    font-family: var(--gbs-jp-font);
    font-size: 0.9375rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.02em;
    border: 1.5px solid rgba(148, 163, 184, 0.5);
    border-radius: 9999px;
    background: linear-gradient(180deg, #fff 0%, #f1f5f9 100%);
    color: #64748b;
    cursor: pointer;
    transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease, color 0.12s ease, border-color 0.12s ease;
    -webkit-tap-highlight-color: transparent;
}

button.gbs-shift-dow-tag {
    appearance: none;
    margin: 0;
}

.gbs-shift-dow-tag--on {
    background: linear-gradient(135deg, var(--gbs-ud-blue) 0%, #4a7fb8 100%);
    border-color: var(--gbs-ud-blue);
    color: #fff;
    box-shadow: 0 2px 6px -1px rgba(74, 127, 184, 0.45);
}

.gbs-shift-dow-tag--we.gbs-shift-dow-tag--on {
    background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
    border-color: #6d28d9;
    box-shadow: 0 2px 6px -1px rgba(109, 40, 217, 0.4);
}

.gbs-shift-dow-tag:hover:not(:disabled):not(.gbs-shift-dow-tag--readonly) {
    transform: translateY(-1px);
    border-color: var(--gbs-ud-blue-light);
    box-shadow: 0 2px 8px -2px rgba(74, 127, 184, 0.35);
}

.gbs-shift-dow-tag--on:hover:not(:disabled) {
    filter: brightness(1.05);
}

.gbs-shift-dow-tag:focus-visible {
    outline: 2px solid var(--gbs-ud-blue);
    outline-offset: 2px;
}

.gbs-shift-dow-tag--readonly {
    cursor: default;
}

.gbs-shift-dow-tag--readonly.gbs-shift-dow-tag--off {
    opacity: 0.35;
    background: #f8fafc;
    border-color: #e2e8f0;
    color: #94a3b8;
    box-shadow: none;
}

.gbs-shift-dow-tag:disabled {
    cursor: default;
}

.gbs-shift-template[data-gbs-shift-table] .gbs-shift-td {
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-shift-template[data-gbs-shift-table] .gbs-shift-td--staff,
.gbs-shift-template[data-gbs-shift-table] .gbs-shift-td--name {
    max-width: none;
    overflow: visible;
}

.gbs-shift-template[data-gbs-shift-table] .gbs-shift-td--workdays {
    overflow: hidden;
}

.gbs-shift-th--day {
    text-align: center;
    min-width: 0;
    width: max-content;
    padding: 0.45rem 0.2rem;
}

.gbs-shift-day-dow-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    margin-top: 0.1rem;
}

.gbs-shift-th-filter-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.2rem;
    width: 100%;
}

.gbs-shift-th--filterable {
    text-align: center;
}

.gbs-shift-day-filter {
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    padding: 0;
    border: none;
    border-radius: 2px;
    cursor: pointer;
    background: transparent;
    opacity: 0.55;
    transition: opacity 0.15s ease, background 0.15s ease;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M1 2h14l-5.5 7v4.5L7.5 15V9L1 2z'/%3E%3C/svg%3E") center / 0.65rem 0.65rem no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M1 2h14l-5.5 7v4.5L7.5 15V9L1 2z'/%3E%3C/svg%3E") center / 0.65rem 0.65rem no-repeat;
    background-color: #16a34a;
}

.gbs-shift-day-filter:hover,
.gbs-shift-day-filter--active {
    opacity: 1;
    background-color: #15803d;
}

.gbs-shift-day-filter--active {
    box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.45);
}

.gbs-shift-day-filter-menu {
    position: absolute;
    z-index: 120;
    min-width: 9.5rem;
    padding: 0.35rem 0;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    background: #fff;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
}

.gbs-shift-day-filter-menu__item {
    display: block;
    width: 100%;
    padding: 0.45rem 0.85rem;
    border: none;
    background: transparent;
    text-align: left;
    font-size: 0.8125rem;
    color: #1e293b;
    cursor: pointer;
}

.gbs-shift-day-filter-menu__item:hover,
.gbs-shift-day-filter-menu__item.is-selected {
    background: #eff6ff;
    color: #1d4ed8;
}

.gbs-shift-day-filter-menu__sep {
    height: 1px;
    margin: 0.25rem 0;
    background: #e2e8f0;
}

.gbs-shift-day-filter-menu__item--clear {
    color: #64748b;
    font-size: 0.75rem;
}

.gbs-shift-value-filter {
    position: absolute;
    z-index: 130;
    width: min(17rem, 92vw);
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    background: #fff;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
    overflow: hidden;
}

.gbs-shift-value-filter__head {
    padding: 0.55rem 0.75rem 0;
    font-size: 0.75rem;
    color: #64748b;
}

.gbs-shift-value-filter__search-wrap {
    padding: 0.45rem 0.75rem;
}

.gbs-shift-value-filter__search {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 0.375rem;
    padding: 0.35rem 0.55rem;
    font-size: 0.8125rem;
}

.gbs-shift-value-filter__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    padding: 0 0.75rem 0.35rem;
    font-size: 0.75rem;
    color: #64748b;
}

.gbs-shift-value-filter__link {
    border: none;
    background: transparent;
    color: #2563eb;
    cursor: pointer;
    padding: 0;
    font-size: inherit;
}

.gbs-shift-value-filter__count {
    margin-left: auto;
}

.gbs-shift-value-filter__list {
    max-height: 14rem;
    overflow-y: auto;
    padding: 0.25rem 0.75rem;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-shift-value-filter__item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.3rem 0;
    font-size: 0.8125rem;
    cursor: pointer;
}

.gbs-shift-value-filter__foot {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.55rem 0.75rem;
}

.gbs-shift-value-filter__btn {
    border-radius: 0.375rem;
    padding: 0.35rem 0.85rem;
    font-size: 0.8125rem;
    cursor: pointer;
}

.gbs-shift-value-filter__btn--cancel {
    border: 1px solid #cbd5e1;
    background: #fff;
    color: #475569;
}

.gbs-shift-value-filter__btn--ok {
    border: 1px solid #16a34a;
    background: #16a34a;
    color: #fff;
}

.gbs-shift-row--filtered-out {
    display: none;
}

.gbs-shift-col-hidden {
    display: none !important;
}

.gbs-shift-toolbar__columns {
    flex-shrink: 0;
}

.gbs-shift-toolbar__columns .gbs-col-picker-open {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 1rem;
    line-height: 1;
}

.gbs-shift-th--weekend {
    background: linear-gradient(180deg, #b8c9dc 0%, #cbd5e1 100%);
    color: #1e3a5f;
}

.gbs-shift-th--today {
    background: linear-gradient(180deg, #93c5fd 0%, #bfdbfe 100%);
    color: #1e3a8a;
    box-shadow: inset 0 -3px 0 #2563eb;
}

.gbs-shift-th--num,
.gbs-shift-td--num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.gbs-shift-th--summary,
.gbs-shift-td--summary {
    background: rgba(237, 244, 250, 0.65);
    font-weight: 600;
}

.gbs-shift-th--border,
.gbs-shift-td--border {
    border-right-width: 2px;
    border-right-color: var(--gbs-table-border);
}

.gbs-shift-day-num {
    display: block;
    font-size: 1.0625rem;
    font-weight: 800;
    line-height: 1.15;
}

.gbs-shift-day-dow {
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--gbs-shift-accent);
    line-height: 1.25;
}

.gbs-shift-row {
    content-visibility: auto;
    contain-intrinsic-size: auto 1.75rem;
}

.gbs-shift-row:nth-child(even) .gbs-shift-td {
    background: var(--gbs-table-row-alt);
}

.gbs-shift-row:hover .gbs-shift-td {
    background: var(--gbs-table-row-hover);
}

.gbs-shift-td--muted {
    text-align: center;
    color: #94a3b8;
}

.gbs-shift-td--staff {
    font-weight: 800;
    font-size: 1rem;
    color: var(--gbs-shift-ink);
    max-width: 7rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-shift-td--name {
    font-weight: 700;
    font-size: 1rem;
    color: var(--gbs-shift-ink);
    max-width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-shift-td--center {
    text-align: center;
}

.gbs-shift-td--weekend {
    background: rgba(248, 250, 252, 0.95);
}

.gbs-shift-td--today {
    background: rgba(239, 246, 255, 0.85);
}

.gbs-shift-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.25rem;
    padding: 0.75rem 1rem;
    background: #fff;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-shift-toolbar__freeze {
    flex: 1 1 16rem;
    min-width: 0;
}

.gbs-shift-toolbar__headcount {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    flex-shrink: 0;
    margin: 0;
    padding: 0.45rem 0.75rem;
    border-radius: 0.55rem;
    border: 1px solid rgba(74, 127, 184, 0.22);
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.gbs-shift-toolbar__headcount-label {
    font-size: 0.875rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: var(--gbs-shift-accent);
    white-space: nowrap;
}

.gbs-shift-toolbar .gbs-shift-headcount-input {
    width: 4.75rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    font-size: 1.25rem;
    color: #2563eb;
    border-radius: 0.5rem;
    border: 2px solid rgba(74, 127, 184, 0.3);
    padding: 0.4rem 0.45rem;
    min-height: 2.5rem;
}

/* —— Confirm dialog (save / delete) —— */
body.gbs-confirm-open {
    overflow: hidden;
}

.gbs-confirm-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    background: rgba(15, 23, 42, 0.42);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

.gbs-confirm-overlay--open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.gbs-confirm-dialog {
    width: min(100%, 22rem);
    padding: 1.35rem 1.35rem 1.15rem;
    border-radius: 1rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    box-shadow:
        0 24px 48px -12px rgba(15, 23, 42, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.6) inset;
    text-align: center;
    transform: translateY(12px) scale(0.97);
    transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}

.gbs-confirm-overlay--open .gbs-confirm-dialog {
    transform: translateY(0) scale(1);
}

.gbs-confirm-dialog__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    margin: 0 auto 0.85rem;
    border-radius: 9999px;
    background: linear-gradient(135deg, rgba(74, 127, 184, 0.15) 0%, rgba(139, 180, 220, 0.25) 100%);
    color: var(--gbs-ud-blue);
}

.gbs-confirm-dialog__icon svg {
    width: 1.5rem;
    height: 1.5rem;
}

.gbs-confirm-dialog__title {
    margin: 0 0 0.45rem;
    font-size: 1.0625rem;
    font-weight: 800;
    letter-spacing: 0.01em;
    color: #0f172a;
    line-height: 1.35;
}

.gbs-confirm-dialog__message {
    margin: 0 0 1.15rem;
    font-size: 0.875rem;
    line-height: 1.55;
    color: #64748b;
}

.gbs-confirm-dialog__actions {
    display: flex;
    gap: 0.55rem;
    justify-content: center;
}

.gbs-confirm-dialog__btn {
    flex: 1 1 0;
    min-width: 0;
    padding: 0.55rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    border-radius: 0.55rem;
}

.gbs-confirm-dialog__btn--cancel {
    background: #fff;
    border: 1.5px solid #cbd5e1;
    color: #475569;
}

.gbs-confirm-dialog__btn--cancel:hover {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #1e293b;
}

.gbs-confirm-dialog__btn--ok {
    box-shadow: 0 4px 12px -2px rgba(74, 127, 184, 0.45);
}

.gbs-shift-freeze-bar {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.gbs-shift-freeze-bar__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1.25rem;
}

.gbs-shift-freeze-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    margin: 0;
    cursor: pointer;
    user-select: none;
}

.gbs-shift-freeze-toggle__input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.gbs-shift-freeze-toggle__track {
    position: relative;
    flex-shrink: 0;
    width: 2.375rem;
    height: 1.375rem;
    border-radius: 9999px;
    background: #cbd5e1;
    transition: background 0.2s ease, box-shadow 0.2s ease;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.12);
}

.gbs-shift-freeze-toggle__thumb {
    position: absolute;
    top: 0.125rem;
    left: 0.125rem;
    width: 1.125rem;
    height: 1.125rem;
    border-radius: 9999px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.2);
    transition: transform 0.2s ease;
}

.gbs-shift-freeze-toggle__input:checked + .gbs-shift-freeze-toggle__track {
    background: linear-gradient(135deg, var(--gbs-ud-blue) 0%, #4a7fb8 100%);
    box-shadow: 0 0 0 2px rgba(74, 127, 184, 0.2);
}

.gbs-shift-freeze-toggle__input:checked + .gbs-shift-freeze-toggle__track .gbs-shift-freeze-toggle__thumb {
    transform: translateX(1rem);
}

.gbs-shift-freeze-toggle__input:focus-visible + .gbs-shift-freeze-toggle__track {
    outline: 2px solid var(--gbs-ud-blue);
    outline-offset: 2px;
}

.gbs-shift-freeze-toggle__label {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: 0.01em;
}

.gbs-shift-freeze-bar__pick {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 0.8125rem;
    color: #475569;
}

.gbs-shift-freeze-bar__pick-label {
    font-weight: 600;
    white-space: nowrap;
    color: #64748b;
}

.gbs-shift-freeze-bar__select {
    min-width: 10rem;
    max-width: 15rem;
    font-size: 0.8125rem;
    font-weight: 600;
    padding: 0.4rem 0.65rem;
    border-radius: 0.5rem;
    border-color: rgba(74, 127, 184, 0.35);
    background: #fff;
    color: #1e293b;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gbs-shift-freeze-bar__select:not(:disabled):hover {
    border-color: var(--gbs-ud-blue-light);
}

.gbs-shift-freeze-bar__select:not(:disabled):focus {
    border-color: var(--gbs-ud-blue);
    box-shadow: 0 0 0 3px rgba(74, 127, 184, 0.18);
}

.gbs-shift-freeze-bar__select:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    background: #f8fafc;
}

.gbs-shift-freeze-bar__hint {
    display: none;
}

.gbs-shift-col-frozen {
    position: sticky;
    background-clip: padding-box;
    background-color: #fff;
}

.gbs-shift-template thead .gbs-shift-col-frozen {
    background: linear-gradient(180deg, #dceaf5 0%, #c8dff0 100%);
    overflow: visible;
    white-space: nowrap;
}

.gbs-shift-template thead .gbs-shift-col-frozen .gbs-shift-th__label {
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-shift-template thead .gbs-shift-col-frozen .gbs-shift-col-resize {
    z-index: 55;
}

.gbs-shift-template col {
    width: auto;
}

.gbs-shift-template tbody .gbs-shift-col-frozen {
    background-color: #fff;
}

.gbs-shift-row:nth-child(even) .gbs-shift-col-frozen {
    background-color: var(--gbs-table-row-alt);
}

.gbs-shift-row:hover .gbs-shift-col-frozen {
    background-color: var(--gbs-table-row-hover);
}

.gbs-shift-template tfoot .gbs-shift-col-frozen {
    background-color: #eef2f7;
}

.gbs-shift-col-frozen-edge {
    box-shadow: 4px 0 10px -4px rgba(15, 23, 42, 0.18);
}

.gbs-shift-col-frozen-right {
    position: sticky;
    background-clip: padding-box;
    background-color: #fff;
}

.gbs-shift-template thead .gbs-shift-col-frozen-right {
    background: linear-gradient(180deg, #dceaf5 0%, #c8dff0 100%);
    overflow: visible;
    white-space: nowrap;
}

.gbs-shift-template tbody .gbs-shift-col-frozen-right {
    background-color: #fff;
}

.gbs-shift-row:nth-child(even) .gbs-shift-col-frozen-right {
    background-color: var(--gbs-table-row-alt);
}

.gbs-shift-row:hover .gbs-shift-col-frozen-right {
    background-color: var(--gbs-table-row-hover);
}

.gbs-shift-template tfoot .gbs-shift-col-frozen-right {
    background-color: #eef2f7;
}

.gbs-shift-col-frozen-right-edge {
    box-shadow: -4px 0 10px -4px rgba(15, 23, 42, 0.18);
}

.gbs-shift-freeze-bar__row--right {
    margin-top: 0.35rem;
}

.gbs-shift-freeze-bar__pick-label--hint {
    max-width: 14rem;
    font-size: 0.72rem;
    color: #64748b;
    line-height: 1.35;
}

.gbs-col-picker-item--locked .gbs-col-picker-label {
    color: #475569;
}

.gbs-col-picker-item--locked .gbs-col-picker-checkbox:disabled {
    opacity: 0.85;
}

/* content-visibility on rows breaks horizontal sticky columns */
.gbs-shift-freeze--on .gbs-shift-row,
.gbs-shift-freeze-right--on .gbs-shift-row {
    content-visibility: visible;
    contain-intrinsic-size: auto;
}

.gbs-shift-td--workdays {
    overflow: hidden;
}

.gbs-shift-td--pct {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.gbs-shift-sticky-col {
    position: sticky;
    left: 0;
    z-index: 12;
    background: #fff;
    box-shadow: 2px 0 6px -2px rgba(15, 23, 42, 0.12);
}

.gbs-shift-template td.gbs-shift-cell--editable {
    padding: 0;
    cursor: cell;
}

.gbs-shift-template .gbs-input--cell {
    display: block;
    width: 100%;
    min-height: 2rem;
    padding: 0.3rem 0.45rem;
    font-size: inherit;
    line-height: 1.4;
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-variant-numeric: tabular-nums;
}

.gbs-input--cell-narrow {
    max-width: 2.75rem;
}

.gbs-input--cell-day {
    text-align: center;
    min-width: 2.5rem;
}

.gbs-shift-template .gbs-input--cell:not([readonly]):not(:disabled) {
    cursor: text;
    user-select: text;
    -webkit-user-select: text;
}

.gbs-shift-template td.gbs-shift-cell--editable:hover .gbs-input--cell:not([readonly]):not(:disabled),
.gbs-shift-template .gbs-input--cell:not([readonly]):not(:disabled):hover {
    background: #fffbeb;
}

.gbs-shift-template .gbs-input--cell:not([readonly]):not(:disabled):focus {
    outline: 2px solid var(--gbs-brand);
    outline-offset: -2px;
    background: #fff;
    z-index: 2;
    position: relative;
}

/* Over-limit */
.gbs-shift-cell--over {
    background: rgb(254 226 226 / 0.35) !important;
    box-shadow: inset 0 0 0 1px rgb(220 38 38 / 0.75);
}

.gbs-shift-template .gbs-input--over {
    background: rgb(254 226 226 / 0.95) !important;
    color: #991b1b;
    font-weight: 700;
}

.gbs-shift-cell--over-max {
    background: rgb(254 226 226) !important;
    color: #b91c1c !important;
    font-weight: 800 !important;
    box-shadow: inset 3px 0 0 #dc2626;
}

.gbs-shift-row--over:hover td.gbs-shift-cell--over {
    background: rgb(254 202 202 / 0.95) !important;
}

.gbs-shift-hours-alert {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.875rem 1rem;
    border-radius: 0.75rem;
    border: 2px solid #dc2626;
    background: linear-gradient(135deg, rgb(254 226 226) 0%, rgb(254 242 242) 100%);
    box-shadow: 0 4px 14px rgb(220 38 38 / 0.15);
    color: #7f1d1d;
}

.gbs-shift-hours-alert__icon {
    flex-shrink: 0;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 9999px;
    background: #dc2626;
    color: #fff;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.75rem;
    text-align: center;
}

.gbs-shift-hours-alert__title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 800;
    color: #991b1b;
}

.gbs-shift-hours-alert__intro {
    margin: 0.25rem 0 0.5rem;
    font-size: 0.8rem;
    line-height: 1.45;
}

.gbs-shift-hours-alert__list {
    margin: 0;
    padding-left: 1.1rem;
    font-size: 0.82rem;
    line-height: 1.5;
}

.gbs-shift-hours-alert__list li + li {
    margin-top: 0.65rem;
}

.gbs-shift-hours-alert__item {
    padding: 0.5rem 0;
    border-top: 1px solid rgb(220 38 38 / 0.2);
}

.gbs-shift-hours-alert__item:first-child {
    border-top: none;
    padding-top: 0;
}

.gbs-shift-hours-alert__staff {
    font-size: 0.9rem;
}

.gbs-shift-hours-alert__window,
.gbs-shift-hours-alert__active {
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    opacity: 0.95;
}

.gbs-shift-hours-alert__breakdown {
    margin: 0.35rem 0 0;
    padding-left: 1.1rem;
    list-style: disc;
    font-size: 0.8125rem;
}

.gbs-shift-hours-alert__breakdown-title {
    list-style: none;
    margin-left: -1.1rem;
    font-weight: 600;
}

.gbs-shift-hours-alert__proj-current {
    font-weight: 600;
}

.gbs-shift-hours-alert__proj-tag {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0.05rem 0.4rem;
    border-radius: 0.25rem;
    background: rgb(127 29 29 / 0.12);
    font-size: 0.75rem;
    font-weight: 600;
}

.gbs-shift-hours-alert__proj-link {
    color: #991b1b;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.gbs-shift-hours-alert__proj-link:hover {
    color: #7f1d1d;
}

.gbs-dispatch-dup-banner {
    display: none;
    gap: 0.75rem;
    align-items: flex-start;
    margin-bottom: 1rem;
    padding: 0.875rem 1rem;
    border-radius: 0.75rem;
    border: 2px solid #d97706;
    background: linear-gradient(135deg, rgb(254 243 199) 0%, rgb(255 251 235) 100%);
    color: #92400e;
}

.gbs-dispatch-dup-banner.is-visible,
.gbs-dispatch-dup-banner:not([hidden]) {
    display: flex;
}

.gbs-dispatch-dup-banner__icon {
    flex-shrink: 0;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 9999px;
    background: #d97706;
    color: #fff;
    font-weight: 800;
    font-size: 1rem;
    line-height: 1.75rem;
    text-align: center;
}

.gbs-dispatch-dup-banner__title {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 800;
}

.gbs-dispatch-dup-banner__hint {
    margin: 0.25rem 0 0.5rem;
    font-size: 0.8rem;
    line-height: 1.45;
}

.gbs-dispatch-dup-summary {
    margin-bottom: 1rem;
    padding: 1rem 1.1rem;
}

.gbs-dispatch-dup-summary__title {
    margin: 0 0 0.75rem;
    font-size: 0.9rem;
    font-weight: 800;
    color: #0f172a;
}

.gbs-dispatch-dup-summary__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
    gap: 0.65rem 1rem;
    margin: 0;
}

.gbs-dispatch-dup-summary__item dt {
    margin: 0;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dispatch-dup-summary__item dd {
    margin: 0.15rem 0 0;
    font-size: 0.84rem;
    color: #0f172a;
    word-break: break-word;
}

.gbs-dispatch-reg__field-hint {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.68rem;
    line-height: 1.35;
    color: #64748b;
}

.gbs-dispatch-reg__input--invalid {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 2px rgb(220 38 38 / 0.15);
}

/* Derived */
.gbs-shift-cell--derived {
    background: rgb(240 253 244 / 0.95) !important;
}

.gbs-shift-template .gbs-input--derived:placeholder-shown {
    color: #166534;
    font-weight: 600;
}

/* Attendance markers (欠 / 早 / 遅 / 公欠) */
.gbs-shift-marker-panel {
    position: absolute;
    z-index: 120;
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 0.35rem;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    box-shadow: 0 4px 14px rgb(15 23 42 / 0.12);
}

.gbs-shift-marker-btn {
    min-width: 2rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
    border: 1px solid transparent;
    border-radius: 0.35rem;
    cursor: pointer;
    background: #f8fafc;
    color: #0f172a;
}

.gbs-shift-marker-btn:hover {
    filter: brightness(0.96);
}

.gbs-shift-marker-btn--absent { background: #fecaca; }
.gbs-shift-marker-btn--early { background: #bbf7d0; }
.gbs-shift-marker-btn--late { background: #fed7aa; }
.gbs-shift-marker-btn--official_absent { background: #fdba74; color: #7c2d12; }
.gbs-shift-marker-btn--clear {
    background: #fff;
    border-color: #cbd5e1;
    font-weight: 600;
}

.gbs-shift-td--marker-absent,
.gbs-shift-td--marker-absent .gbs-input--cell-day {
    background: #fecaca !important;
}

.gbs-shift-td--marker-early,
.gbs-shift-td--marker-early .gbs-input--cell-day {
    background: #bbf7d0 !important;
}

.gbs-shift-td--marker-late,
.gbs-shift-td--marker-late .gbs-input--cell-day {
    background: #fed7aa !important;
}

.gbs-shift-td--marker-official_absent,
.gbs-shift-td--marker-official_absent .gbs-input--cell-day {
    background: #fdba74 !important;
}

.gbs-shift-td--marker-absent.gbs-shift-cell--derived,
.gbs-shift-td--marker-early.gbs-shift-cell--derived,
.gbs-shift-td--marker-late.gbs-shift-cell--derived,
.gbs-shift-td--marker-official_absent.gbs-shift-cell--derived {
    background: inherit !important;
}

.gbs-input--marker {
    font-weight: 700;
    text-align: center;
}

.gbs-shift-legend__dot--marker-absent { background: #fecaca; }
.gbs-shift-legend__dot--marker-early { background: #bbf7d0; }
.gbs-shift-legend__dot--marker-late { background: #fed7aa; }
.gbs-shift-legend__dot--marker-official { background: #fdba74; }
.gbs-shift-legend__dot--shift-day { background: #3b82f6; }
.gbs-shift-legend__dot--shift-night { background: #8b5cf6; }
.gbs-shift-legend__dot--shift-off { background: #94a3b8; }
.gbs-shift-legend__dot--override {
    background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
    box-shadow: inset 0 0 0 1px rgb(234 88 12 / 0.45);
    color: #c2410c;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    padding: 0;
    border-radius: 999px;
}

.gbs-shift-legend__dot--override svg {
    width: 0.62rem;
    height: 0.62rem;
    display: block;
}

.gbs-shift-cell-picker {
    position: absolute;
    z-index: 125;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 11rem;
    padding: 0.4rem;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    box-shadow: 0 4px 14px rgb(15 23 42 / 0.12);
}

.gbs-shift-cell-picker__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
}

.gbs-shift-cell-picker__title {
    width: 100%;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-shift-cell-picker__btn {
    min-width: 2rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.8125rem;
    font-weight: 700;
    border: 1px solid transparent;
    border-radius: 0.35rem;
    cursor: pointer;
}

.gbs-shift-cell-picker__btn--day { background: #3b82f6; color: #fff; border-color: #2563eb; }
.gbs-shift-cell-picker__btn--night { background: #7c3aed; color: #fff; border-color: #6d28d9; }
.gbs-shift-cell-picker__btn--off { background: #64748b; color: #fff; border-color: #475569; }

.gbs-shift-cell-picker__clear {
    align-self: flex-start;
    padding: 0.2rem 0.55rem;
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    background: #fff;
    cursor: pointer;
}

/* Custom row / cell highlight colors */
[data-gbs-row-color] > .gbs-shift-td:not(.has-custom-color),
[data-gbs-row-color] > .gbs-ss-v2__cell:not(.has-custom-color) {
    background: var(--gbs-row-custom-bg) !important;
    background-image: none !important;
    box-shadow: inset 0 0 0 1px rgb(15 23 42 / 0.08) !important;
}

.gbs-shift-td.has-custom-color,
.gbs-ss-v2__cell.has-custom-color {
    background: var(--gbs-cell-custom-bg) !important;
    background-image: none !important;
    box-shadow: inset 0 0 0 1px rgb(15 23 42 / 0.12) !important;
}

.gbs-shift-color-control {
    display: inline-flex;
    flex-shrink: 0;
}

.gbs-shift-staff-no-wrap {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}

.gbs-shift-color-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    padding: 0;
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    background: #fff;
    cursor: pointer;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.05);
}

.gbs-shift-color-btn--readonly {
    cursor: default;
    opacity: 0.85;
}

.gbs-shift-color-btn__swatch {
    display: block;
    width: 0.85rem;
    height: 0.85rem;
    border-radius: 0.2rem;
    border: 1px solid rgb(15 23 42 / 0.12);
    background: linear-gradient(135deg, #f8fafc 45%, #e2e8f0 55%);
}

.gbs-shift-color-panel {
    position: fixed;
    z-index: 12050;
    min-width: 11rem;
    padding: 0.55rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.55rem;
    background: #fff;
    box-shadow: 0 12px 28px rgb(15 23 42 / 0.16);
}

.gbs-shift-color-panel__title {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: #475569;
}

.gbs-shift-color-panel__grid {
    display: grid;
    grid-template-columns: repeat(6, 1.15rem);
    gap: 0.3rem;
}

.gbs-shift-color-swatch {
    width: 1.15rem;
    height: 1.15rem;
    padding: 0;
    border: 1px solid rgb(15 23 42 / 0.15);
    border-radius: 0.25rem;
    cursor: pointer;
}

.gbs-shift-color-swatch.is-selected {
    outline: 2px solid #2563eb;
    outline-offset: 1px;
}

.gbs-shift-color-panel__custom {
    margin-top: 0.45rem;
}

.gbs-shift-color-panel__native {
    width: 100%;
    height: 1.75rem;
    padding: 0;
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    cursor: pointer;
    background: #fff;
}

.gbs-shift-color-panel__clear {
    width: 100%;
    margin-top: 0.45rem;
    padding: 0.28rem 0.45rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.35rem;
    cursor: pointer;
}

.gbs-shift-cell-picker__row--color {
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px solid #e2e8f0;
}

.gbs-shift-cell-picker__time-section {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-top: 0.25rem;
    border-top: 1px solid #e2e8f0;
}

.gbs-shift-cell-picker__time-range-wrap {
    width: 100%;
}

.gbs-shift-cell-picker .gbs-time-range {
    min-width: 0;
    width: 100%;
}

.gbs-shift-cell-picker .gbs-time-range__track {
    height: 1.25rem;
}

.gbs-shift-cell-picker .gbs-time-range--invalid .gbs-time-range__track {
    border-color: #ef4444;
    box-shadow: inset 0 0 0 1px #ef4444;
}

.gbs-shift-cell-picker__break-row {
    display: flex;
    justify-content: flex-end;
}

.gbs-shift-cell-picker__break-row .gbs-shift-cell-picker__field {
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
}

.gbs-shift-cell-picker__break-row .gbs-shift-cell-picker__time-input {
    width: 3.5rem;
    text-align: center;
}

.gbs-shift-cell-picker__field {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.gbs-shift-cell-picker__field-label {
    font-size: 0.625rem;
    font-weight: 600;
    color: #64748b;
}

.gbs-shift-cell-picker__time-input {
    width: 100%;
    padding: 0.2rem 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid #cbd5e1;
    border-radius: 0.3rem;
    background: #f8fafc;
}

.gbs-shift-cell-picker__time-input:focus {
    outline: 2px solid #3b82f6;
    outline-offset: 0;
    border-color: #3b82f6;
    background: #fff;
}

.gbs-shift-cell-picker__time-input.is-invalid {
    border-color: #ef4444;
    background: #fef2f2;
}

.gbs-shift-cell-picker__time-actions {
    display: flex;
    gap: 0.35rem;
}

.gbs-shift-cell-picker__apply {
    flex: 1;
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 700;
    color: #fff;
    background: #2563eb;
    border: 1px solid #1d4ed8;
    border-radius: 0.35rem;
    cursor: pointer;
}

.gbs-shift-cell-picker__reset {
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 0.35rem;
    cursor: pointer;
}

.gbs-shift-cell--override .gbs-ss-v2__pill.is-override::after {
    content: none;
}

.gbs-shift-td--shift-day,
.gbs-shift-td--shift-night,
.gbs-shift-td--shift-off {
    position: relative;
    padding: 2px !important;
}

.gbs-shift-td--shift-day {
    background: linear-gradient(180deg, #93c5fd 0%, #bfdbfe 55%, #dbeafe 100%) !important;
    box-shadow: inset 0 0 0 1px rgb(37 99 235 / 0.45);
}

.gbs-shift-td--shift-night {
    background: linear-gradient(180deg, #a78bfa 0%, #c4b5fd 55%, #ddd6fe 100%) !important;
    box-shadow: inset 0 0 0 1px rgb(109 40 217 / 0.45);
}

.gbs-shift-td--shift-off {
    background: linear-gradient(180deg, #cbd5e1 0%, #e2e8f0 100%) !important;
    box-shadow: inset 0 0 0 1px rgb(100 116 139 / 0.4);
}

.gbs-shift-td--shift-day::after,
.gbs-shift-td--shift-night::after,
.gbs-shift-td--shift-off::after {
    content: none;
    display: none;
}

.gbs-shift-td--shift-day .gbs-input--cell-day {
    background: rgb(255 255 255 / 0.62) !important;
    border-radius: 0.2rem;
    color: #1e3a8a;
}

.gbs-shift-td--shift-night .gbs-input--cell-day {
    background: rgb(255 255 255 / 0.62) !important;
    border-radius: 0.2rem;
    color: #5b21b6;
}

.gbs-shift-td--shift-off .gbs-input--cell-day {
    background: rgb(255 255 255 / 0.45) !important;
    border-radius: 0.2rem;
    color: #64748b;
}

.gbs-shift-cell--derived.gbs-shift-td--shift-day {
    background: linear-gradient(180deg, #86efac 0%, #93c5fd 45%, #bfdbfe 100%) !important;
}

.gbs-shift-cell--derived.gbs-shift-td--shift-night {
    background: linear-gradient(180deg, #86efac 0%, #a78bfa 45%, #c4b5fd 100%) !important;
}

.gbs-shift-td--shift-off,
.gbs-shift-td--shift-off .gbs-input--cell-day {
    color: #64748b;
}

.gbs-input--shift {
    font-weight: 700;
    text-align: center;
}

.gbs-time-range--overnight .gbs-time-range__fill {
    background: linear-gradient(90deg, #6366f1 0%, #8b5cf6 100%);
}

.gbs-time-range--overnight .gbs-time-range__time--start,
.gbs-time-range--overnight .gbs-time-range__time--end {
    color: #5b21b6;
    font-weight: 700;
}

.gbs-time-range--day-shift .gbs-time-range__fill {
    background: linear-gradient(90deg, #2563eb 0%, #60a5fa 100%);
}

.gbs-time-range--day-shift .gbs-time-range__time--start,
.gbs-time-range--day-shift .gbs-time-range__time--end {
    color: #1d4ed8;
    font-weight: 700;
}

.gbs-time-range__shift-kind {
    display: inline-block;
    margin-left: 0.35rem;
    padding: 0 0.35rem;
    font-size: 0.625rem;
    font-weight: 800;
    line-height: 1.35;
    border-radius: 0.2rem;
    vertical-align: middle;
}

.gbs-time-range--day-shift .gbs-time-range__shift-kind {
    color: #1e40af;
    background: #dbeafe;
}

.gbs-time-range--overnight .gbs-time-range__shift-kind {
    color: #5b21b6;
    background: #ede9fe;
}

/* Footer — Excel-style green summary rows (row 100 headcount / row 101 daily hours) */
.gbs-shift-footer td,
.gbs-shift-footer .gbs-shift-td {
    background: #d9ead3;
    border-color: #93c47d;
    font-weight: 700;
    color: #1b3d1b;
}

.gbs-shift-footer-row--totals td,
.gbs-shift-footer-row--totals .gbs-shift-td {
    background: #c9e2c0;
    border-color: #7cb86c;
}

.gbs-shift-footer-row--headcount + .gbs-shift-footer-row--totals td,
.gbs-shift-footer-row--headcount + .gbs-shift-footer-row--totals .gbs-shift-td {
    border-top: 1px solid #e2e8f0;
}

.gbs-shift-footer .gbs-shift-td--weekend {
    background: #cfe8c6;
}

.gbs-shift-footer-row--totals .gbs-shift-td--weekend {
    background: #bddcb3;
}

.gbs-shift-footer-label {
    font-size: 0.6875rem;
    text-transform: none;
    letter-spacing: 0.02em;
    color: #274e27;
    text-align: left;
    white-space: nowrap;
}

.gbs-shift-footer-label--primary {
    font-size: 0.75rem;
    font-weight: 800;
    color: #0f3d0f;
    min-width: 6.5rem;
}

.gbs-shift-footer-pad {
    padding: 0.25rem;
}

.gbs-shift-footer .gbs-shift-footer-label--primary,
.gbs-shift-footer-row--headcount .gbs-shift-footer-label--primary {
    background: #d9ead3;
}

.gbs-shift-footer-row--totals .gbs-shift-footer-label--primary {
    background: #c9e2c0;
}

.gbs-shift-footer .gbs-shift-col-frozen.gbs-shift-footer-label--primary {
    background: #d9ead3;
}

.gbs-shift-footer-row--totals .gbs-shift-col-frozen.gbs-shift-footer-label--primary {
    background: #c9e2c0;
}

.gbs-shift-footer-unit {
    font-size: 0.75rem;
    color: #3d5c3d;
}

.gbs-shift-footer-day {
    font-variant-numeric: tabular-nums;
}

.gbs-shift-footer-grand {
    color: #0f3d0f;
}

.gbs-shift-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    padding: 0.85rem 1rem;
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    border-top: 1px solid var(--gbs-shift-border);
}

@media (min-width: 768px) {
    .gbs-shift-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .gbs-shift-summary-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

.gbs-shift-summary-card {
    padding: 0.85rem 1rem;
    background: #fff;
    border: 1px solid rgba(74, 127, 184, 0.2);
    border-radius: 0.75rem;
}

.gbs-shift-summary-card--accent {
    border-color: rgba(74, 127, 184, 0.28);
    background: #fff;
}

.gbs-shift-summary-card__label {
    display: block;
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: var(--gbs-shift-accent);
    margin-bottom: 0.3rem;
}

.gbs-shift-summary-card__value {
    font-size: 1.25rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #0f2744;
}

.gbs-shift-summary-card--accent .gbs-shift-summary-card__value {
    color: var(--gbs-ud-blue);
}

.gbs-shift-summary-card__value small {
    font-size: 0.75rem;
    font-weight: 700;
}

.gbs-shift-summary-card__detail {
    display: block;
    margin-top: 0.35rem;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.35;
    color: #475569;
}

/* Action bar */
.gbs-shift-action-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem 1.25rem;
    margin-top: 1rem;
    padding: 1rem 1.15rem;
    background: linear-gradient(135deg, #eff6ff 0%, #fff 100%);
    border: 2px solid rgba(74, 127, 184, 0.22);
    border-radius: var(--gbs-shift-radius);
    box-shadow: 0 4px 16px -6px rgba(30, 74, 122, 0.14);
}

.gbs-shift-action-bar__hint {
    margin: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--gbs-shift-muted);
    line-height: 1.6;
    max-width: 36rem;
}

.gbs-shift-save-btn {
    min-width: 10rem;
    min-height: 3.125rem;
    font-size: 1.0625rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    border-radius: 9999px;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
}

.gbs-shift-save-btn--pending {
    opacity: 0.72;
    cursor: wait;
    pointer-events: none;
}

@media (max-width: 639px) {
    .gbs-shift-page-card {
        padding: 0.75rem !important;
        border-radius: 0.875rem;
    }

    .gbs-shift-page-header {
        flex-direction: column;
        align-items: stretch;
        margin-bottom: 0.75rem !important;
        gap: 0.65rem !important;
    }

    .gbs-shift-page-title {
        font-size: 1.375rem;
    }

    .gbs-shift-dash {
        flex-direction: column;
        padding: 0.5rem;
    }

    .gbs-shift-dash .gbs-shift-owners--inline {
        flex-direction: column;
        align-items: flex-start;
    }

    .gbs-shift-period-filter {
        width: 100%;
    }

    .gbs-shift-period-filter form,
    .gbs-shift-period-form {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
        padding: 0.75rem;
    }

    .gbs-shift-period-form label {
        width: 100%;
    }

    .gbs-shift-period-form .gbs-input,
    .gbs-shift-period-submit {
        width: 100%;
        min-height: 2.75rem;
    }

    .gbs-shift-period-picker {
        width: 100%;
    }

    .gbs-shift-period-picker .gbs-shift-period-picker__trigger {
        width: 100%;
        min-height: 2.75rem;
    }

    .gbs-shift-selector {
        padding: 0.75rem;
        margin-bottom: 1rem;
    }

    .gbs-shift-selector__field {
        flex: 1 1 100%;
    }

    .gbs-shift-selector__input {
        min-height: 2.875rem;
        font-size: 1rem;
    }

    .gbs-shift-kpi-strip {
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .gbs-shift-kpi {
        padding: 0.65rem 0.75rem;
    }

    .gbs-shift-kpi__value {
        font-size: 1.375rem;
    }

    .gbs-shift-owners {
        padding: 0.75rem;
    }

    .gbs-shift-meta-tile {
        padding: 0.7rem 0.85rem;
    }

    .gbs-shift-meta-tile--limit {
        align-items: flex-start;
    }

    .gbs-shift-legend {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        gap: 0.65rem;
        padding: 0.6rem 0.85rem;
        scrollbar-width: none;
    }

    .gbs-shift-legend::-webkit-scrollbar {
        display: none;
    }

    .gbs-shift-legend__item {
        flex-shrink: 0;
        white-space: nowrap;
    }

    .gbs-shift-notes-row {
        padding: 0.75rem;
        gap: 0.65rem;
    }

    .gbs-shift-notes-input,
    .gbs-shift-headcount-input {
        min-height: 2.75rem;
        font-size: 1rem;
    }

    .gbs-shift-check {
        min-height: 2.75rem;
        padding: 0.25rem 0;
    }

    .gbs-shift-grid-shell {
        position: relative;
    }

    .gbs-shift-scroll-hint {
        display: flex;
    }

    .gbs-shift-grid-wrap.gbs-table-wrap {
        max-height: min(52dvh, 28rem);
        margin: 0 -0.25rem;
        border-radius: 0.5rem;
    }

    .gbs-shift-grid-shell--scrolled-x .gbs-shift-scroll-hint,
    .gbs-shift-scroll-hint--hidden {
        opacity: 0;
        pointer-events: none;
    }

    /* Mobile: hide remarks/announce cols */
    .gbs-shift-template thead .gbs-shift-col-remarks,
    .gbs-shift-template tbody .gbs-shift-col-remarks,
    .gbs-shift-template thead .gbs-shift-col-announce,
    .gbs-shift-template tbody .gbs-shift-col-announce {
        display: none;
    }

    .gbs-shift-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .gbs-shift-toolbar__headcount {
        justify-content: space-between;
        width: 100%;
    }

    .gbs-shift-toolbar__freeze .gbs-shift-freeze-bar__row {
        flex-direction: column;
        align-items: stretch;
    }

    .gbs-shift-toolbar__freeze .gbs-shift-freeze-bar__pick {
        flex-direction: column;
        align-items: stretch;
    }

    .gbs-shift-toolbar__freeze .gbs-shift-freeze-bar__select {
        width: 100%;
        max-width: none;
    }

    .gbs-shift-th,
    .gbs-shift-td {
        padding: 0.28rem 0.35rem;
    }

    .gbs-shift-th--day {
        min-width: 2.85rem;
    }

    .gbs-shift-template .gbs-input--cell {
        min-height: 2rem;
        font-size: 0.8125rem;
        padding: 0.25rem 0.2rem;
    }

    .gbs-shift-dow-tag {
        min-width: 1.875rem;
        height: 1.875rem;
        font-size: 0.75rem;
    }

    .gbs-shift-td--workdays {
        min-width: 10.5rem;
    }

    .gbs-shift-col-resize {
        width: 12px;
        margin-right: -6px;
    }

    .gbs-shift-summary-grid {
        grid-template-columns: 1fr 1fr;
        padding: 0.75rem;
        gap: 0.5rem;
    }

    .gbs-shift-action-bar {
        position: sticky;
        bottom: 0;
        z-index: 45;
        flex-direction: column;
        align-items: stretch;
        margin-top: 0.75rem;
        margin-bottom: -0.25rem;
        padding: 0.75rem 0.85rem;
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
        border-radius: 0.875rem 0.875rem 0 0;
        box-shadow: 0 -10px 28px -6px rgba(15, 23, 42, 0.18);
    }

    .gbs-shift-save-btn {
        width: 100%;
        min-height: 2.875rem;
        font-size: 1rem;
    }

    .gbs-shift-action-bar__hint {
        font-size: 0.6875rem;
        text-align: center;
    }
}

@media (min-width: 640px) and (max-width: 1023px) {
    .gbs-shift-page-card {
        padding: 1.125rem !important;
    }

    .gbs-shift-period-form {
        flex-wrap: wrap;
        gap: 0.5rem 0.75rem;
    }

    .gbs-shift-grid-wrap.gbs-table-wrap {
        max-height: min(60dvh, 36rem);
    }

    .gbs-shift-template .gbs-input--cell {
        min-height: 1.75rem;
        font-size: 0.75rem;
    }
}

/* Scroll hint (mobile) */
.gbs-shift-scroll-hint {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    margin: 0 0 0.35rem;
    padding: 0.35rem 0.65rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: var(--gbs-ud-blue);
    background: rgba(219, 234, 254, 0.65);
    border: 1px dashed rgba(74, 127, 184, 0.35);
    border-radius: 9999px;
    transition: opacity 0.35s ease;
}

.gbs-shift-scroll-hint::before {
    content: '↔';
    font-size: 0.875rem;
    line-height: 1;
}

.gbs-shift-period-form {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.5rem 0.75rem;
}

.gbs-shift-period-picker__label {
    display: block;
    font-size: 0.9375rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--gbs-shift-accent);
    margin-bottom: 0.35rem;
}

.gbs-shift-period-picker .gbs-shift-period-picker__trigger {
    min-width: 12.5rem;
    min-height: 3.125rem;
    border-radius: 0.5rem;
    border: 2px solid rgba(74, 127, 184, 0.3);
    font-size: 1.0625rem;
    font-weight: 800;
    color: var(--gbs-shift-ink);
    background: #fff;
}

.gbs-shift-period-picker .gbs-sales-month-picker__panel {
    width: 16.5rem;
}

.gbs-shift-period-picker__panel-head {
    display: grid;
    grid-template-columns: 2rem 1fr 2rem;
    align-items: center;
    padding: 0.55rem 0.5rem;
    background: linear-gradient(135deg, var(--gbs-ud-blue) 0%, #4a7fb8 100%);
    color: #fff;
    border-bottom: none;
}

.gbs-shift-period-picker__year {
    text-align: center;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: 0.03em;
}

.gbs-shift-period-picker__year-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    padding: 0;
    border: none;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 1.125rem;
    line-height: 1;
    cursor: pointer;
    transition: background 0.12s ease;
}

.gbs-shift-period-picker__year-nav:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.28);
}

.gbs-shift-period-picker__year-nav:disabled {
    opacity: 0.35;
    cursor: default;
}

.gbs-sales-month-picker__grid--3col {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem;
    padding: 0.7rem;
}

.gbs-shift-th--staff-no,
.gbs-shift-col-staff.gbs-shift-td--staff {
    min-width: 5.25rem;
    max-width: 6.5rem;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.gbs-shift-th--nationality,
.gbs-shift-col-nationality {
    min-width: 7.5rem;
    width: 7.5rem;
    max-width: none;
    text-align: left;
    vertical-align: middle;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
}

.gbs-shift-nationality-cell {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

.gbs-shift-nationality-cell__text {
    font-size: 0.625rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.01em;
    color: #475569;
    white-space: nowrap;
}

.gbs-shift-flag {
    display: inline-block;
    width: 22px;
    height: 16px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.12);
    vertical-align: middle;
}

.gbs-shift-flag-code {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #475569;
}

.gbs-shift-th--staff-no {
    font-weight: 700;
    letter-spacing: 0.02em;
}

.gbs-shift-col-timecard.gbs-shift-td--name {
    min-width: 7.5rem;
    max-width: 11rem;
}

.gbs-shift-period-submit {
    font-size: 0.875rem;
    padding: 0.5rem 1.25rem;
    border-radius: 0.5rem;
    font-weight: 600;
}

/* —— Mobile / tablet responsive —— */
@media (max-width: 1023px) {
    body.gbs-app-bg {
        overflow-x: hidden;
    }
}

@media (max-width: 639px) {
    .gbs-main-column .gbs-card {
        padding: 1rem 0.875rem;
        border-radius: 0.875rem;
    }

    .gbs-h1 {
        font-size: 1.125rem;
    }

    .gbs-topbar .gbs-page-container {
        padding-top: 0.625rem;
        padding-bottom: 0.625rem;
        gap: 0.5rem;
    }

    .gbs-main-column main.gbs-page-container {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .gbs-main-column main form.flex.flex-wrap {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .gbs-main-column main form.flex.flex-wrap > div {
        width: 100%;
        min-width: 0;
    }

    .gbs-main-column main form.flex.flex-wrap .gbs-input,
    .gbs-main-column main form.flex.flex-wrap input[type="text"],
    .gbs-main-column main form.flex.flex-wrap select {
        width: 100% !important;
        min-width: 0 !important;
    }

    .gbs-main-column main form.flex.flex-wrap .gbs-btn-primary,
    .gbs-main-column main form.flex.flex-wrap .gbs-btn-secondary,
    .gbs-main-column main form.flex.flex-wrap button[type="submit"] {
        width: 100%;
        justify-content: center;
    }

    .gbs-table-wrap table {
        font-size: 0.8125rem;
    }

    .gbs-table-wrap th,
    .gbs-table-wrap td {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }

    .gbs-lang-select {
        min-width: 5.5rem;
        max-width: 7.5rem;
        font-size: 0.7rem;
    }
}

@media (max-width: 480px) {
    .gbs-orb-a,
    .gbs-orb-b {
        opacity: 0.35;
    }

    .gbs-main-column main nav.gbs-animate-in {
        flex-wrap: wrap;
        row-gap: 0.25rem;
    }
}

.gbs-table-wrap > table tbody tr {
    transition: background 0.15s ease;
}

@media (prefers-reduced-motion: reduce) {
    .gbs-dash-banner__shine,
    .gbs-dash-banner__orb--3,
    .gbs-dash-banner__orb--4 {
        animation: none !important;
    }

    .gbs-app-bg,
    .gbs-orb,
    .gbs-animate-in,
    .gbs-animate-in-delay-1,
    .gbs-animate-in-delay-2,
    .gbs-animate-in-delay-3,
    .gbs-animate-in-delay-4,
    .gbs-animate-in-delay-5,
    .gbs-login-card,
    .animate-gbs-in,
    .gbs-topbar,
    .gbs-nav-list li,
    .gbs-page-enter {
        animation: none !important;
    }
    .gbs-animate-in,
    .gbs-animate-in-delay-1,
    .gbs-animate-in-delay-2,
    .gbs-animate-in-delay-3,
    .gbs-animate-in-delay-4,
    .gbs-animate-in-delay-5,
    .animate-gbs-in,
    .gbs-nav-list li {
        opacity: 1 !important;
    }
    .gbs-app-bg {
        background: #f8fafc;
    }
    .gbs-sidebar {
        transition: none !important;
    }
}

@keyframes gbs-login-shine {
    0% { transform: translateX(-120%) skewX(-12deg); opacity: 0; }
    15% { opacity: 0.35; }
    100% { transform: translateX(220%) skewX(-12deg); opacity: 0; }
}

.gbs-login-card {
    position: relative;
    animation: gbs-fade-up 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-jp-login.gbs-login-card::after {
    display: none;
}

.gbs-login-card:not(.gbs-jp-login) {
    overflow: hidden;
}

.gbs-login-card:not(.gbs-jp-login)::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 40%, rgba(255, 255, 255, 0.45) 50%, transparent 60%);
    pointer-events: none;
    animation: gbs-login-shine 4.5s ease-in-out 0.8s infinite;
}

.gbs-login-logo {
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.gbs-login-logo:hover {
    transform: scale(1.06) rotate(-2deg);
}

.gbs-btn-google {
    position: relative;
    overflow: hidden;
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease, border-color 0.2s ease, background 0.2s ease;
}

.gbs-btn-google:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -6px rgba(15, 23, 42, 0.15);
}

.gbs-btn-google:active {
    transform: translateY(0);
}

.gbs-login-divider {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #94a3b8;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.gbs-login-divider:not(.gbs-jp-login__divider) {
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.gbs-login-divider::before,
.gbs-login-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.45), transparent);
}

.gbs-login-input-wrap {
    transition: transform 0.2s ease;
}

.gbs-login-input-wrap:focus-within {
    transform: translateY(-1px);
}

.gbs-login-input-wrap .gbs-input {
    transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.2s ease;
}

.gbs-login-input-wrap .gbs-input:focus {
    background: #fff;
    box-shadow: 0 0 0 3px rgba(74, 127, 184, 0.2), 0 4px 12px -4px rgba(74, 127, 184, 0.18);
}

.gbs-login-submit {
    position: relative;
    overflow: hidden;
}

.gbs-login-submit::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transform: translateX(-100%);
    transition: transform 0.5s ease;
}

.gbs-login-submit:hover::before {
    transform: translateX(100%);
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gbs-lang-select {
    min-width: 7.5rem;
    max-width: 10rem;
    padding: 0.4rem 2rem 0.4rem 0.65rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #334155;
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.45);
    border-radius: 0.65rem;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.4rem center;
    background-size: 1rem;
}

.gbs-lang-select:hover,
.gbs-lang-select:focus {
    border-color: rgba(74, 127, 184, 0.55);
    box-shadow: 0 0 0 2px rgba(74, 127, 184, 0.15);
    outline: none;
}

/* —— Permission matrix page (2026-02 spec) —— */
.gbs-perm-page .gbs-card {
    border-radius: 0.5rem;
}

.gbs-perm-staff-header {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 0.75rem 0 1.25rem;
    margin-bottom: 0.25rem;
    border-bottom: 1px solid #cbd5e1;
}

.gbs-perm-avatar {
    width: 4.5rem;
    height: 4.5rem;
    border-radius: 9999px;
    background: linear-gradient(145deg, rgba(139, 180, 220, 0.28) 0%, var(--gbs-ud-blue-light) 45%, var(--gbs-ud-blue-light) 100%);
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.1);
    flex-shrink: 0;
}

/* Dispatch staff list — profile or default silhouette */
.gbs-staff-avatar {
    flex-shrink: 0;
    border-radius: 9999px;
    object-fit: cover;
    background: #b8d9ee;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.gbs-staff-avatar--default {
    object-fit: contain;
    padding: 0;
}

.gbs-perm-staff-table {
    border-collapse: collapse;
    font-size: 0.875rem;
}

.gbs-perm-staff-table th {
    padding: 0.2rem 1rem 0.2rem 0;
    font-weight: 600;
    color: #475569;
    text-align: left;
    white-space: nowrap;
    vertical-align: top;
}

.gbs-perm-staff-table td {
    padding: 0.2rem 0;
    color: #0f172a;
    vertical-align: top;
}

.gbs-perm-matrix-intro {
    margin: 0 0 0.65rem;
    padding: 0.65rem 0.85rem;
    font-size: 0.8125rem;
    line-height: 1.45;
    color: #334155;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
}

.gbs-perm-matrix-intro__lead {
    margin: 0 0 0.4rem;
    font-weight: 600;
    color: #0f172a;
}

.gbs-perm-matrix-intro__list {
    margin: 0;
    padding: 0 0 0 1.15rem;
}

.gbs-perm-matrix-intro__list li {
    margin: 0.15rem 0;
}

.gbs-perm-matrix-panel {
    overflow-x: auto;
    border: 1px solid #94a3b8;
    background: #fff;
}

.gbs-perm-matrix__table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 0.8125rem;
}

.gbs-perm-matrix__th {
    padding: 0.45rem 0.5rem;
    font-weight: 700;
    color: #1e293b;
    background: #e8edf2;
    border: 1px solid #94a3b8;
    text-align: center;
    vertical-align: middle;
}

.gbs-perm-matrix__th--pageid {
    width: 5.5rem;
    font-size: 0.75rem;
}

.gbs-perm-matrix__th--content {
    text-align: center;
    width: 46%;
}

.gbs-perm-matrix-panel--with-pageid .gbs-perm-matrix__th--content {
    width: 40%;
}

.gbs-perm-matrix-panel--with-approve .gbs-perm-matrix__th--content,
.gbs-perm-matrix-panel--with-limit50 .gbs-perm-matrix__th--content,
.gbs-perm-matrix-panel--with-csv .gbs-perm-matrix__th--content {
    width: 34%;
}

.gbs-perm-matrix-panel--with-pageid.gbs-perm-matrix-panel--with-approve .gbs-perm-matrix__th--content,
.gbs-perm-matrix-panel--with-pageid.gbs-perm-matrix-panel--with-limit50 .gbs-perm-matrix__th--content,
.gbs-perm-matrix-panel--with-pageid.gbs-perm-matrix-panel--with-csv .gbs-perm-matrix__th--content {
    width: 28%;
}

.gbs-perm-matrix__th--cb {
    width: 18%;
}

.gbs-perm-matrix-panel--with-approve .gbs-perm-matrix__th--cb,
.gbs-perm-matrix-panel--with-limit50 .gbs-perm-matrix__th--cb,
.gbs-perm-matrix-panel--with-csv .gbs-perm-matrix__th--cb {
    width: 11%;
}

.gbs-perm-matrix__th--cb-narrow {
    width: 9%;
    font-size: 0.75rem;
}

.gbs-perm-matrix__th-split {
    display: inline-block;
    line-height: 1.25;
    max-width: 5.5rem;
}

.gbs-perm-matrix__cat-row .gbs-perm-matrix__cat-cell {
    padding: 0.35rem 0.65rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #0f172a;
    background: #b8d9ee;
    border: 1px solid #94a3b8;
}

.gbs-perm-matrix__item-row td {
    border: 1px solid #94a3b8;
    vertical-align: middle;
}

.gbs-perm-matrix__pageid-cell {
    padding: 0.35rem 0.4rem;
    background: #fff;
    text-align: center;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
}

.gbs-perm-matrix__label-cell {
    padding: 0.35rem 0.65rem;
    background: #fff;
    text-align: left;
}

.gbs-perm-matrix__label {
    font-weight: 500;
    color: #1e293b;
    line-height: 1.35;
}

.gbs-perm-matrix__cb-cell {
    text-align: center;
    padding: 0.25rem;
    background: #fff;
}

.gbs-perm-matrix__item-row--virtual td {
    background: #eceff3;
}

.gbs-perm-matrix__item-row--virtual .gbs-perm-matrix__label {
    color: #64748b;
}

.gbs-perm-matrix__cb-cell--na {
    background: #e2e8f0;
}

.gbs-perm-matrix__item-row--note .gbs-perm-matrix__label-cell {
    background: #fff;
}

.gbs-perm-matrix__note-cell {
    padding: 0.35rem 0.65rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    background: #fff;
    text-align: center;
}

/* Error / status pages — dashboard-aligned soft UI */
.gbs-error-page,
.gbs-forbidden {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 0.5rem 0 2rem;
    min-height: min(68vh, 620px);
}

.gbs-error-page__shell,
.gbs-forbidden__card {
    position: relative;
    width: 100%;
    max-width: 40rem;
    overflow: hidden;
    padding: 0;
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.55);
    box-shadow:
        0 8px 28px rgba(15, 23, 42, 0.07),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.gbs-error-page__stripe {
    display: none;
}

.gbs-error-page__accent {
    background: linear-gradient(180deg, var(--gbs-ud-blue) 0%, var(--gbs-ud-blue-light) 100%);
}

.gbs-error-page__badge {
    margin: 0 0 0.35rem;
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--gbs-ud-blue);
}

.gbs-error-page__title,
.gbs-forbidden__h1 {
    font-size: 1.125rem;
}

.gbs-error-page__lead,
.gbs-forbidden__lead {
    margin-top: 0.35rem;
}

.gbs-error-page__status {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 0.15rem 0.85rem;
    margin: 0 0 1rem;
    padding: 1rem 1.1rem;
    text-align: left;
}

.gbs-error-page__status-icon {
    grid-row: 1 / span 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 0.85rem;
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.65);
    color: inherit;
}

.gbs-error-page__icon,
.gbs-forbidden__icon {
    width: 1.65rem;
    height: 1.65rem;
}

.gbs-error-page__status-code,
.gbs-forbidden__code {
    position: static;
    display: block;
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
    color: inherit;
    background: none;
    box-shadow: none;
    padding: 0;
}

.gbs-error-page__status-label {
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.35;
    opacity: 0.92;
}

.gbs-error-page__info-box,
.gbs-forbidden__screen-box {
    margin: 0 0 1rem;
    padding: 0.95rem 1rem;
    border-radius: 1rem;
    background: linear-gradient(160deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid rgba(148, 163, 184, 0.18);
    text-align: left;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}

.gbs-error-page__info-label,
.gbs-forbidden__screen-label {
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.gbs-error-page__info-title,
.gbs-forbidden__screen-title {
    margin-top: 0.3rem;
    font-size: 1rem;
}

.gbs-error-page__info-meta,
.gbs-forbidden__screen-meta {
    margin-top: 0.6rem;
}

.gbs-error-page__pageid-badge,
.gbs-forbidden__pageid-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: var(--gbs-ud-blue);
    background: rgba(139, 180, 220, 0.22);
    border: 1px solid rgba(139, 180, 220, 0.55);
    border-radius: 9999px;
    padding: 0.25rem 0.65rem;
}

.gbs-error-page__pageid-badge strong,
.gbs-forbidden__pageid-badge strong {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-weight: 700;
    color: var(--gbs-ud-blue);
}

.gbs-error-page__body,
.gbs-forbidden__body {
    margin: 0 0 1rem;
    font-size: 0.875rem;
    color: #475569;
    line-height: 1.65;
    text-align: left;
}

.gbs-error-page__detail {
    display: block;
    margin: 0 0 0.85rem;
    padding: 0.9rem 1rem;
    text-align: left;
}

.gbs-error-page__detail-label {
    display: block;
    margin-bottom: 0.35rem;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--gbs-ud-blue);
}

.gbs-error-page__detail-text {
    margin: 0;
    font-size: 0.75rem;
    line-height: 1.55;
    word-break: break-all;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    color: var(--gbs-ud-blue);
}

.gbs-error-page__hint {
    display: block;
    margin: 0 0 0.85rem;
    padding: 0.9rem 1rem;
    text-align: left;
}

.gbs-error-page__hint p {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--gbs-ud-blue);
}

/* UD two-color tiles (medium blue + light blue only) */
.gbs-error-page__tile {
    border-radius: 0.875rem;
    border: 1px solid transparent;
}

.gbs-error-page__tile--primary {
    background: linear-gradient(180deg, rgba(74, 127, 184, 0.12) 0%, rgba(139, 180, 220, 0.24) 100%);
    border-color: rgba(74, 127, 184, 0.28);
    color: var(--gbs-ud-blue);
    box-shadow: 0 6px 18px rgba(74, 127, 184, 0.1);
}

.gbs-error-page__tile--light {
    background: linear-gradient(180deg, rgba(139, 180, 220, 0.22) 0%, rgba(139, 180, 220, 0.38) 100%);
    border-color: rgba(139, 180, 220, 0.55);
    color: var(--gbs-ud-blue);
    box-shadow: 0 6px 18px rgba(139, 180, 220, 0.12);
}

.gbs-error-page__detail.gbs-error-page__tile--primary {
    border-width: 2px;
    border-color: var(--gbs-ud-blue);
}

.gbs-error-page__inner {
    padding: 1.35rem 1.35rem 1.5rem;
}

.gbs-error-page__head {
    margin-bottom: 1.1rem;
}

.gbs-error-page__tips-panel {
    margin: 0 0 1rem;
    padding: 0.95rem 1rem 0.85rem;
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.62);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.55);
    box-shadow:
        0 8px 28px rgba(15, 23, 42, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.gbs-error-page__tips-heading {
    margin: 0 0 0.55rem;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gbs-ud-blue);
}

.gbs-error-page__tips,
.gbs-forbidden__tips {
    margin: 0;
    padding: 0 0 0 1.15rem;
    text-align: left;
    font-size: 0.8125rem;
    color: #334155;
    line-height: 1.55;
    list-style: disc;
    background: none;
    border: none;
    border-radius: 0;
}

.gbs-error-page__tips li + li,
.gbs-forbidden__tips li + li {
    margin-top: 0.35rem;
}

.gbs-error-page__actions,
.gbs-forbidden__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    justify-content: flex-start;
    margin-top: 0.35rem;
    padding-top: 0.35rem;
    border-top: 1px solid rgba(148, 163, 184, 0.14);
}

.gbs-error-page__btn,
.gbs-forbidden__btn-primary,
.gbs-forbidden__btn-back {
    min-width: 9.5rem;
}

.gbs-body--plain {
    min-height: 100vh;
    background: linear-gradient(180deg, #f8fafc 0%, #edf4fa 100%);
}

.gbs-main--plain {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 1rem;
}

.gbs-main--plain .gbs-error-page {
    min-height: auto;
    padding: 0;
    width: 100%;
}

.gbs-main--plain .gbs-error-page__shell {
    max-width: 42rem;
}

@media (max-width: 480px) {
    .gbs-error-page__inner,
    .gbs-forbidden__card {
        padding: 1.15rem 1rem 1.25rem;
    }

    .gbs-error-page__actions,
    .gbs-forbidden__actions {
        flex-direction: column;
    }

    .gbs-error-page__btn,
    .gbs-forbidden__btn-primary,
    .gbs-forbidden__btn-back {
        width: 100%;
    }
}

.gbs-perm-cb-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.35rem;
    height: 1.35rem;
    margin: 0 auto;
    cursor: pointer;
}

.gbs-perm-cb {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
}

.gbs-perm-cb-box {
    display: block;
    width: 1.15rem;
    height: 1.15rem;
    border: 1px solid #64748b;
    border-radius: 2px;
    background: #fff;
    box-sizing: border-box;
    pointer-events: none;
}

.gbs-perm-cb:checked + .gbs-perm-cb-box {
    background: var(--gbs-ud-blue);
    border-color: #1d4ed8;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' d='M2 6l3 3 5-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0.75rem;
}

.gbs-perm-cb:disabled {
    cursor: not-allowed;
}

.gbs-perm-cb:disabled + .gbs-perm-cb-box {
    background: #d1d5db;
    border-color: #9ca3af;
}

.gbs-perm-cb:disabled:checked + .gbs-perm-cb-box {
    background: #94a3b8;
    border-color: #64748b;
}

.gbs-perm-cb:focus-visible + .gbs-perm-cb-box {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 2px;
}

.gbs-perm-page .gbs-perm-raw {
    margin-top: 0.75rem;
    font-size: 0.75rem;
    color: #64748b;
}

.gbs-perm-page .gbs-perm-raw code {
    font-size: 0.7rem;
    background: #f1f5f9;
    padding: 0.15rem 0.35rem;
    border-radius: 0.2rem;
}

/* Staff evaluation — collapsible panels */
.gbs-eval-collapse__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.gbs-eval-collapse__summary::-webkit-details-marker {
    display: none;
}

.gbs-eval-collapse__summary::marker {
    content: '';
}

.gbs-eval-collapse--primary .gbs-eval-collapse__summary {
    background: #5b9bd5;
    color: #fff;
}

.gbs-eval-collapse--past .gbs-eval-collapse__summary {
    background: #e2e8f0;
    color: #1e293b;
}

.gbs-eval-collapse__title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-eval-collapse__chevron {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 0.25rem;
    background: rgba(255, 255, 255, 0.22);
    position: relative;
}

.gbs-eval-collapse--past .gbs-eval-collapse__chevron {
    background: rgba(15, 23, 42, 0.08);
}

.gbs-eval-collapse__chevron::before {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid currentColor;
    transform: translateY(1px);
    color: inherit;
}

.gbs-eval-collapse--primary .gbs-eval-collapse__chevron::before {
    color: #fff;
}

.gbs-eval-collapse--past .gbs-eval-collapse__chevron::before {
    color: #475569;
}

.gbs-eval-collapse[open] .gbs-eval-collapse__chevron::before {
    transform: rotate(180deg) translateY(-1px);
}

.gbs-eval-collapse__summary:hover {
    filter: brightness(1.03);
}

.gbs-eval-collapse__summary:focus-visible {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 2px;
}

.gbs-eval-collapse__body {
    background: #fff;
}

/* Staff evaluation — interactive star rating (no Tailwind peer utilities required) */
.gbs-eval-stars {
    display: inline-flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: center;
    gap: 0.125rem;
    flex-shrink: 0;
}

.gbs-eval-stars__input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gbs-eval-stars__label {
    cursor: pointer;
    user-select: none;
    font-size: 1.125rem;
    line-height: 1;
    color: #e2e8f0;
    transition: color 0.12s ease;
}

.gbs-eval-stars__input:checked ~ .gbs-eval-stars__label,
.gbs-eval-stars__label:hover,
.gbs-eval-stars__label:hover ~ .gbs-eval-stars__label {
    color: #ca8a04;
}

.gbs-eval-stars--disabled .gbs-eval-stars__label {
    cursor: default;
    opacity: 0.7;
    pointer-events: none;
}

.gbs-eval-star-filled {
    color: #ca8a04;
}

/* —— Page registry admin (bo_page_data) —— */
.gbs-page-registry {
    --gbs-pr-accent: var(--gbs-ud-blue);
    --gbs-pr-accent-soft: rgba(74, 127, 184, 0.1);
    --gbs-pr-sky: var(--gbs-ud-blue-light);
    --gbs-pr-pale: var(--gbs-ud-blue-light);
    --gbs-pr-ice: rgba(139, 180, 220, 0.25);
    --gbs-pr-mist: rgba(139, 180, 220, 0.12);
    --gbs-pr-deep: var(--gbs-ud-blue);
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(ellipse 80% 50% at 100% 0%, rgba(139, 180, 220, 0.35) 0%, transparent 55%),
        radial-gradient(ellipse 60% 40% at 0% 100%, rgba(139, 180, 220, 0.3) 0%, transparent 50%),
        radial-gradient(ellipse 50% 30% at 50% 0%, rgba(139, 180, 220, 0.5) 0%, transparent 45%),
        #fff !important;
    border: 1px solid rgba(139, 180, 220, 0.45) !important;
    box-shadow:
        0 4px 6px rgba(15, 23, 42, 0.04),
        0 20px 48px rgba(74, 127, 184, 0.1) !important;
}

.gbs-pr-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem 1.25rem;
    margin: -0.25rem -0.25rem 1.25rem;
    border-radius: 1rem;
    border: 1px solid rgba(139, 180, 220, 0.55);
    background: linear-gradient(135deg, rgba(139, 180, 220, 0.98) 0%, rgba(139, 180, 220, 0.92) 50%, rgba(139, 180, 220, 0.88) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.gbs-pr-header .gbs-h1 {
    background: linear-gradient(135deg, var(--gbs-ud-blue) 0%, var(--gbs-ud-blue) 45%, var(--gbs-ud-blue-light) 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.gbs-pr-header__icon {
    width: 3rem;
    height: 3rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    background: linear-gradient(145deg, var(--gbs-ud-blue-light) 0%, var(--gbs-ud-blue) 50%, var(--gbs-ud-blue-light) 100%);
    border: none;
    flex-shrink: 0;
    box-shadow: 0 8px 20px rgba(74, 127, 184, 0.35);
}

.gbs-pr-header__icon svg {
    color: #fff !important;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.15));
}

.gbs-pr-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

@media (min-width: 640px) {
    .gbs-pr-stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.gbs-pr-stat {
    position: relative;
    padding: 1rem 1rem 0.9rem;
    border-radius: 1rem;
    border: 1px solid transparent;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gbs-pr-stat::before {
    display: none;
}

.gbs-pr-stat:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
}

.gbs-pr-stats .gbs-pr-stat:nth-child(1) {
    background: linear-gradient(145deg, rgba(139, 180, 220, 0.14) 0%, rgba(139, 180, 220, 0.28) 100%);
    border-color: rgba(96, 165, 250, 0.5);
    color: #1d4ed8;
}

.gbs-pr-stats .gbs-pr-stat:nth-child(2) {
    background: linear-gradient(145deg, #f0f9ff 0%, #e0f2fe 100%);
    border-color: rgba(56, 189, 248, 0.45);
    color: #0369a1;
}

.gbs-pr-stats .gbs-pr-stat:nth-child(3) {
    background: linear-gradient(145deg, #edf4fa 0%, #dceaf5 100%);
    border-color: rgba(74, 127, 184, 0.35);
    color: var(--gbs-brand-dark);
}

.gbs-pr-stats .gbs-pr-stat:nth-child(4) {
    background: linear-gradient(145deg, #f8fafc 0%, rgba(139, 180, 220, 0.45) 100%);
    border-color: rgba(74, 127, 184, 0.4);
    color: var(--gbs-ud-blue);
}

.gbs-pr-stat__val {
    font-size: 1.65rem;
    font-weight: 800;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    color: inherit;
}

.gbs-pr-stat__lbl {
    margin-top: 0.25rem;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    opacity: 0.85;
    color: inherit;
}

.gbs-pr-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.gbs-pr-search {
    flex: 1 1 14rem;
    min-width: 0;
    padding: 0.55rem 0.85rem 0.55rem 2.35rem;
    font-size: 0.875rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(148, 163, 184, 0.5);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2394a3b8'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E") no-repeat 0.65rem center;
    background-size: 1.1rem;
}

.gbs-pr-search:focus {
    outline: none;
    border-color: rgba(74, 127, 184, 0.55);
    box-shadow: 0 0 0 3px rgba(139, 180, 220, 0.45);
}

.gbs-pr-callout {
    font-size: 0.75rem;
    line-height: 1.55;
    color: #475569;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    background: var(--gbs-pr-accent-soft);
    border: 1px solid rgba(139, 180, 220, 0.35);
    margin-bottom: 1.25rem;
}

.gbs-pr-callout code {
    font-size: 0.68rem;
    padding: 0.1rem 0.35rem;
    border-radius: 0.35rem;
    background: rgba(255, 255, 255, 0.85);
}

.gbs-pr-group {
    margin-bottom: 1.25rem;
}

.gbs-pr-group__head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.15rem 0.65rem;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #475569;
}

.gbs-pr-page {
    border: 1px solid rgba(148, 163, 184, 0.4);
    border-radius: 0.85rem;
    background: #fff;
    margin-bottom: 0.65rem;
    overflow: hidden;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.gbs-pr-page[open] {
    border-color: rgba(79, 70, 229, 0.35);
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.06);
}

.gbs-pr-page__summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.85rem 1rem;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.gbs-pr-page__summary::-webkit-details-marker {
    display: none;
}

.gbs-pr-page__summary::after {
    content: '';
    margin-left: auto;
    width: 0.5rem;
    height: 0.5rem;
    border-right: 2px solid #64748b;
    border-bottom: 2px solid #64748b;
    transform: rotate(45deg);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.gbs-pr-page[open] .gbs-pr-page__summary::after {
    transform: rotate(-135deg) translateY(2px);
}

.gbs-pr-page__id {
    font-family: ui-monospace, monospace;
    font-size: 0.8rem;
    font-weight: 800;
    color: var(--gbs-pr-accent);
    padding: 0.2rem 0.5rem;
    border-radius: 0.4rem;
    background: var(--gbs-pr-accent-soft);
}

.gbs-pr-page__title {
    font-size: 0.9rem;
    font-weight: 700;
    color: #0f172a;
}

.gbs-pr-page__sub {
    font-size: 0.75rem;
    color: #64748b;
    width: 100%;
}

@media (min-width: 640px) {
    .gbs-pr-page__sub {
        width: auto;
        flex: 1;
    }
}

.gbs-pr-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.gbs-pr-badge {
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.2rem 0.45rem;
    border-radius: 0.35rem;
}

.gbs-pr-badge--linked {
    color: #047857;
    background: #d1fae5;
}

.gbs-pr-badge--meta {
    color: #475569;
    background: #e2e8f0;
}

.gbs-pr-badge--menu {
    color: #1d4ed8;
    background: rgba(139, 180, 220, 0.28);
}

.gbs-pr-badge--perm {
    color: #0369a1;
    background: #e0f2fe;
}

.gbs-pr-page__body {
    padding: 0 1rem 1rem;
    border-top: 1px solid rgba(148, 163, 184, 0.25);
    background: #f8fafc;
}

.gbs-pr-fieldset {
    margin-top: 1rem;
    padding: 0;
    border: none;
}

.gbs-pr-fieldset__legend {
    font-size: 0.68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #64748b;
    padding: 0 0 0.5rem;
    width: 100%;
    border-bottom: 1px solid rgba(148, 163, 184, 0.3);
    margin-bottom: 0.75rem;
}

.gbs-pr-grid {
    display: grid;
    gap: 0.75rem;
}

@media (min-width: 640px) {
    .gbs-pr-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.gbs-pr-grid--3 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 640px) {
    .gbs-pr-grid--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.gbs-pr-field label > span:first-child {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    color: #475569;
    margin-bottom: 0.3rem;
}

.gbs-pr-field input[type='text'],
.gbs-pr-field input[type='number'],
.gbs-pr-field input[type='email'],
.gbs-pr-field select,
.gbs-pr-field textarea {
    width: 100%;
    padding: 0.5rem 0.7rem;
    font-size: 0.875rem;
    border-radius: 0.55rem;
    border: 1px solid rgba(148, 163, 184, 0.55);
    background: #fff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gbs-pr-field input:focus,
.gbs-pr-field select:focus,
.gbs-pr-field textarea:focus {
    outline: none;
    border-color: rgba(79, 70, 229, 0.5);
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.gbs-pr-field--perm {
    grid-column: 1 / -1;
}

.gbs-pr-select {
    width: 100%;
    max-width: 42rem;
    font-size: 0.875rem;
}

.gbs-pr-flags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.gbs-pr-flag {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.75rem;
    border-radius: 9999px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.gbs-pr-flag:has(input:checked) {
    border-color: rgba(74, 127, 184, 0.45);
    background: rgba(139, 180, 220, 0.14);
    color: #1d4ed8;
}

.gbs-pr-flag input {
    width: 0.95rem;
    height: 0.95rem;
    accent-color: var(--gbs-pr-accent);
}

.gbs-pr-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 1rem;
    margin-top: 0.5rem;
    border-top: 1px solid rgba(148, 163, 184, 0.25);
}

.gbs-pr-add {
    margin-top: 1.5rem;
    border: 2px dashed rgba(139, 180, 220, 0.65);
    border-radius: 1rem;
    background: linear-gradient(180deg, rgba(139, 180, 220, 0.75) 0%, #fff 100%);
}

.gbs-pr-add__summary {
    padding: 1rem 1.15rem;
    font-size: 0.9rem;
    font-weight: 800;
    color: var(--gbs-ud-blue);
    cursor: pointer;
    list-style: none;
}

.gbs-pr-add__summary::-webkit-details-marker {
    display: none;
}

.gbs-pr-add__body {
    padding: 0 1.15rem 1.15rem;
}

.gbs-pr-empty {
    text-align: center;
    padding: 2rem 1rem;
    color: #64748b;
    font-size: 0.875rem;
}

.gbs-pr-alert {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.gbs-pr-alert--ok {
    color: var(--gbs-ud-blue);
    background: rgba(139, 180, 220, 0.14);
    border: 1px solid rgba(139, 180, 220, 0.45);
}

.gbs-pr-alert--err {
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
}

.gbs-pr-alert__icon {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    background: #a7f3d0;
    color: #047857;
    font-size: 0.75rem;
    font-weight: 800;
}

.gbs-pr-alert__icon--err {
    background: #fecaca;
    color: #b91c1c;
}

.gbs-pr-alert--ok {
    transition: opacity 0.35s ease, transform 0.35s ease;
}

.gbs-pr-header__icon svg {
    display: block;
    color: var(--gbs-pr-accent);
}

.gbs-pr-toolbar--sticky {
    position: sticky;
    top: 0.5rem;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    padding: 0.65rem 0.85rem;
    margin-bottom: 1rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.gbs-pr-toolbar--sticky .gbs-pr-search {
    flex: 1 1 12rem;
    min-width: 10rem;
}

.gbs-pr-dirty {
    font-size: 0.72rem;
    font-weight: 700;
    color: #b45309;
    background: #fffbeb;
    border: 1px solid #fcd34d;
    padding: 0.25rem 0.55rem;
    border-radius: 9999px;
}

.gbs-page-registry--dirty .gbs-pr-save-btn {
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.25);
}

.gbs-pr-table-wrap {
    overflow-x: auto;
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}

.gbs-pr-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 0.8125rem;
    border: 1px solid #94a3b8;
}

.gbs-pr-col-id { width: 4.25rem; }
.gbs-pr-col-name { width: 12%; }
.gbs-pr-col-cat { width: 9%; }
.gbs-pr-col-num { width: 3.1rem; }
.gbs-pr-col-cb { width: 3.25rem; }
.gbs-pr-col-perm { width: 4.25rem; }
.gbs-pr-col-test { width: 2.75rem; }
.gbs-pr-col-main { width: 6.5rem; }
.gbs-pr-col-view { width: 6.5rem; }
.gbs-pr-col-mail { width: 9%; }
.gbs-pr-col-etc { width: 11%; }

/* Page registry: fit viewport — no forced horizontal scroll */
.gbs-page-registry .gbs-pr-table-wrap {
    overflow-x: hidden;
}

.gbs-page-registry .gbs-pr-table {
    table-layout: fixed;
    width: 100%;
    min-width: 0;
}

.gbs-page-registry .gbs-pr-col-id { width: 3.75rem; }
.gbs-page-registry .gbs-pr-col-name { width: 15%; }
.gbs-page-registry .gbs-pr-col-cat { width: 13%; }
.gbs-page-registry .gbs-pr-col-num { width: 3.75rem; }
.gbs-page-registry .gbs-pr-col-cb { width: 4.5rem; }
.gbs-page-registry .gbs-pr-col-perm { width: 26rem; }
.gbs-page-registry .gbs-pr-col-test { width: 11%; }
.gbs-page-registry .gbs-pr-col-main { width: 11%; }
.gbs-page-registry .gbs-pr-col-view { width: 7%; }
.gbs-page-registry .gbs-pr-col-mail { width: 12%; }
.gbs-page-registry .gbs-pr-col-etc { width: 14%; }

.gbs-page-registry--locale-en .gbs-pr-col-name,
.gbs-page-registry--locale-ja .gbs-pr-col-name {
    width: 17%;
}

.gbs-page-registry--locale-en .gbs-pr-col-cat,
.gbs-page-registry--locale-ja .gbs-pr-col-cat {
    width: 15%;
}

.gbs-page-registry--locale-en .gbs-pr-col-mail,
.gbs-page-registry--locale-ja .gbs-pr-col-mail {
    width: 13%;
}

.gbs-page-registry--locale-en .gbs-pr-col-etc,
.gbs-page-registry--locale-ja .gbs-pr-col-etc {
    width: 15%;
}

.gbs-pr-table__th,
.gbs-pr-table__row td,
.gbs-pr-table__cat td {
    border: 1px solid #cbd5e1;
}

.gbs-pr-table__th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 0.65rem 0.5rem;
    text-align: left;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    white-space: nowrap;
}

.gbs-pr-table__th--id { min-width: 4.25rem; }
.gbs-pr-table__th--num {
    width: 3.1rem;
    min-width: 3.1rem;
    max-width: 3.1rem;
    text-align: center;
    font-size: 0.6rem;
    letter-spacing: 0.02em;
    white-space: nowrap;
    line-height: 1.2;
    vertical-align: bottom;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}

.gbs-pr-table__th--sort-label {
    text-transform: none;
    font-size: 0.65rem;
    letter-spacing: 0;
}
.gbs-pr-table__th--cb {
    width: 3.25rem;
    min-width: 3.25rem;
    max-width: 3.25rem;
    text-align: center;
    white-space: nowrap;
    line-height: 1.2;
    vertical-align: bottom;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}
.gbs-pr-table__th--perm {
    width: 4.25rem;
    max-width: 4.25rem;
    font-size: 0.6rem;
    line-height: 1.2;
    white-space: nowrap;
    text-align: center;
}

.gbs-page-registry .gbs-pr-table__th--sort-wide {
    width: 3.75rem;
    min-width: 0;
    max-width: 3.75rem;
    font-size: 0.58rem;
    white-space: normal;
    line-height: 1.15;
    text-align: center;
    vertical-align: bottom;
    padding: 0.4rem 0.2rem;
}

.gbs-page-registry .gbs-pr-table__th--cb {
    width: 4.5rem;
    min-width: 0;
    max-width: 4.5rem;
    white-space: normal;
    line-height: 1.2;
    text-align: center;
    vertical-align: bottom;
    padding: 0.4rem 0.2rem;
    font-size: 0.58rem;
    letter-spacing: 0.02em;
}

.gbs-page-registry .gbs-pr-table__th--perm-wide {
    width: 26rem;
    min-width: 26rem;
    max-width: none;
    font-size: 0.62rem;
    white-space: normal;
    line-height: 1.2;
    text-align: left;
    padding: 0.45rem 0.5rem;
}

.gbs-page-registry .gbs-pr-table__th--test,
.gbs-page-registry .gbs-pr-table__th--main {
    width: auto;
    min-width: 0;
    max-width: none;
    white-space: normal;
    line-height: 1.15;
    text-align: left;
    font-size: 0.58rem;
    padding: 0.4rem 0.25rem;
}

.gbs-page-registry .gbs-pr-table__th--view {
    width: auto;
    min-width: 0;
    max-width: none;
    font-size: 0.58rem;
}
.gbs-pr-table__th--test {
    width: 2.75rem;
    max-width: 2.75rem;
    text-align: center;
}
.gbs-pr-table__th--view {
    width: 6.5rem;
    max-width: 6.5rem;
    text-align: center;
}
.gbs-pr-table__th--mail,
.gbs-pr-table__th--etc {
    font-size: 0.6rem;
}

.gbs-pr-table__cell--num {
    text-align: center;
    padding-left: 0.35rem !important;
    padding-right: 0.35rem !important;
    background: #f8fafc;
}

.gbs-pr-table__cell--perm {
    width: 4.25rem;
    max-width: 4.25rem;
    overflow: hidden;
    text-align: center;
}

.gbs-page-registry .gbs-pr-table__cell--num {
    min-width: 0;
    width: 3.75rem;
    max-width: 3.75rem;
}

.gbs-page-registry .gbs-pr-table__cell--perm {
    width: 26rem;
    min-width: 26rem;
    max-width: none;
    overflow: visible;
    text-align: left;
}

.gbs-page-registry .gbs-pr-table__cell--test,
.gbs-page-registry .gbs-pr-table__cell--main,
.gbs-page-registry .gbs-pr-table__cell--view {
    overflow: visible;
    text-align: left;
}

.gbs-page-registry .gbs-pr-table__cell--test {
    min-width: 0;
    width: auto;
}

.gbs-page-registry .gbs-pr-table__cell--main {
    min-width: 0;
    width: auto;
}

.gbs-page-registry .gbs-pr-table__cell--view {
    width: auto;
    min-width: 0;
    max-width: none;
}

.gbs-page-registry .gbs-pr-table__cell--mail,
.gbs-page-registry .gbs-pr-table__cell--etc {
    overflow: visible;
}

.gbs-pr-table__cell--view {
    width: 6.5rem;
    max-width: 6.5rem;
    text-align: center;
}

.gbs-pr-table__cell--mail,
.gbs-pr-table__cell--etc {
    overflow: hidden;
}

.gbs-pr-table__cat td {
    padding: 0.55rem 0.75rem;
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--gbs-ud-blue);
    background: rgba(139, 180, 220, 0.14);
    border-bottom: 1px solid rgba(139, 180, 220, 0.35);
}

.gbs-pr-table__cat-count {
    font-weight: 600;
    color: #94a3b8;
}

.gbs-pr-table__row td {
    padding: 0.35rem 0.28rem;
    vertical-align: middle;
    white-space: nowrap;
}

.gbs-pr-table__row td:nth-child(2),
.gbs-pr-table__row td:nth-child(3),
.gbs-pr-table__row td:nth-child(4),
.gbs-pr-table__row td:nth-child(5),
.gbs-pr-table__row td.gbs-pr-table__cell--mail,
.gbs-pr-table__row td.gbs-pr-table__cell--etc {
    white-space: normal;
    background: #fff;
}

.gbs-pr-table__row:nth-child(4n) td {
    background: #fafbfc;
}

.gbs-pr-table__row:hover td {
    background: #f8fafc;
}

.gbs-pr-table__row--highlight td {
    background: rgba(139, 180, 220, 0.28) !important;
}

.gbs-pr-table__id {
    padding-left: 0.65rem !important;
    white-space: nowrap;
}

.gbs-pr-table__id .gbs-pr-page__id {
    display: block;
    margin-bottom: 0.2rem;
}

.gbs-pr-table__id .gbs-pr-badge {
    font-size: 0.55rem;
    padding: 0.1rem 0.3rem;
}

.gbs-pr-table__cb {
    text-align: center;
}

.gbs-page-registry .gbs-pr-table__cb {
    min-width: 0;
    width: 4.5rem;
    max-width: 4.5rem;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
}

.gbs-pr-tbl-input,
.gbs-pr-tbl-select {
    width: 100%;
    min-width: 0;
    padding: 0.38rem 0.5rem;
    font-size: 0.8125rem;
    border: 1px solid transparent;
    border-radius: 0.45rem;
    background: transparent;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.gbs-pr-tbl-input:hover,
.gbs-pr-tbl-select:hover {
    background: #fff;
    border-color: rgba(148, 163, 184, 0.45);
}

.gbs-pr-tbl-input:focus,
.gbs-pr-tbl-select:focus {
    outline: none;
    background: #fff;
    border-color: rgba(79, 70, 229, 0.45);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.12);
}

.gbs-page-registry .gbs-pr-tbl-input--num {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    font-size: 0.75rem;
}

.gbs-pr-tbl-input--num {
    text-align: center;
    width: 2.65rem;
    min-width: 2.65rem;
    max-width: 2.65rem;
    margin: 0 auto;
    display: block;
    font-size: 0.75rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
    background: #fff !important;
    border: 1px solid #94a3b8 !important;
    border-radius: 0.35rem;
    padding: 0.3rem 0.15rem !important;
}

.gbs-pr-tbl-input--test {
    text-align: center;
    width: 2.35rem;
    max-width: 2.35rem;
    min-width: 2.35rem;
    margin: 0 auto;
    display: block;
    padding-left: 0.15rem !important;
    padding-right: 0.15rem !important;
}

.gbs-pr-table__cell--perm .gbs-pr-tbl-select {
    width: 2.85rem;
    max-width: 2.85rem;
    min-width: 2.85rem;
    margin: 0 auto;
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    padding: 0.28rem 0.15rem;
    text-align: center;
    text-align-last: center;
}

.gbs-page-registry .gbs-pr-table__cell--perm .gbs-pr-tbl-select {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.3;
    padding: 0.4rem 1.85rem 0.4rem 0.45rem;
    text-align: left;
    text-align-last: left;
    white-space: normal;
}

.gbs-page-registry .gbs-pr-tbl-select--test,
.gbs-page-registry .gbs-pr-tbl-select--main {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    margin: 0;
    display: block;
    font-size: 0.65rem;
    font-weight: 600;
    line-height: 1.2;
    padding: 0.3rem 1.35rem 0.3rem 0.3rem;
    text-align: left;
    text-align-last: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-page-registry .gbs-pr-tbl-select--view {
    max-width: none;
    min-width: 0;
    width: 100%;
    font-size: 0.7rem;
}

.gbs-page-registry .gbs-pr-tbl-input--mail {
    min-width: 0;
}

.gbs-page-registry .gbs-pr-tbl-input--etc {
    min-width: 0;
    font-size: 0.72rem;
    line-height: 1.3;
}

.gbs-page-registry .gbs-pr-table__row td:nth-child(2),
.gbs-page-registry .gbs-pr-table__row td:nth-child(3) {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.gbs-pr-tbl-select--view {
    width: 100%;
    max-width: 6.25rem;
    min-width: 5.75rem;
    margin: 0 auto;
    display: block;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 0.28rem 1.35rem 0.28rem 0.25rem;
    text-align: left;
    text-align-last: left;
}

.gbs-pr-tbl-input--mail,
.gbs-pr-tbl-input--etc {
    width: 100%;
    min-width: 0;
    font-size: 0.72rem;
    padding: 0.32rem 0.35rem !important;
}

.gbs-pr-tbl-input--cat {
    min-width: 6.5rem;
}

.gbs-pr-tbl-cb {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.gbs-pr-tbl-cb__input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.gbs-pr-tbl-cb__box {
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 0.35rem;
    border: 2px solid #cbd5e1;
    background: #fff;
    transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.gbs-pr-tbl-cb__input:checked + .gbs-pr-tbl-cb__box {
    border-color: var(--gbs-pr-accent);
    background: var(--gbs-pr-accent);
    box-shadow: inset 0 0 0 2px #fff;
}

.gbs-pr-tbl-cb__input:focus-visible + .gbs-pr-tbl-cb__box {
    outline: 2px solid rgba(79, 70, 229, 0.45);
    outline-offset: 2px;
}

.gbs-pr-expand-btn {
    width: 1.75rem;
    height: 1.75rem;
    border: 1px solid rgba(148, 163, 184, 0.45);
    border-radius: 0.45rem;
    background: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.gbs-pr-expand-btn:hover {
    background: #f1f5f9;
}

.gbs-pr-expand-btn__icon {
    width: 0.45rem;
    height: 0.45rem;
    border-right: 2px solid #64748b;
    border-bottom: 2px solid #64748b;
    transform: rotate(-45deg);
    transition: transform 0.2s ease;
}

.gbs-pr-expand-btn.is-open .gbs-pr-expand-btn__icon {
    transform: rotate(45deg) translateY(-1px);
}

.gbs-pr-table__detail td {
    padding: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.3);
    background: #f8fafc;
}

.gbs-pr-detail-panel {
    padding: 0.75rem 1rem 1rem;
}

.gbs-pr-detail-grid {
    display: grid;
    gap: 0.75rem;
}

@media (min-width: 768px) {
    .gbs-pr-detail-grid {
        grid-template-columns: 1fr 2fr;
    }
}

.gbs-pr-detail-field > span {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    color: #64748b;
    margin-bottom: 0.3rem;
}

.gbs-pr-detail-field--wide {
    grid-column: 1 / -1;
}

@media (min-width: 768px) {
    .gbs-pr-detail-field--wide {
        grid-column: auto;
    }
}

.gbs-pr-footer-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.85rem 1rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(148, 163, 184, 0.3);
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

/* —— Page registry: pale blue cool theme —— */
.gbs-page-registry .gbs-pr-alert--ok {
    background: linear-gradient(135deg, rgba(139, 180, 220, 0.14) 0%, rgba(139, 180, 220, 0.45) 100%);
    border-color: var(--gbs-ud-blue-light);
    color: var(--gbs-ud-blue);
    box-shadow: 0 4px 14px rgba(74, 127, 184, 0.15);
}

.gbs-page-registry .gbs-pr-alert__icon {
    background: rgba(139, 180, 220, 0.45);
    color: #1d4ed8;
}

.gbs-page-registry .gbs-pr-toolbar--sticky {
    border-color: rgba(139, 180, 220, 0.55);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(139, 180, 220, 0.96) 100%);
    box-shadow: 0 8px 24px rgba(74, 127, 184, 0.1);
}

.gbs-page-registry .gbs-pr-search:focus {
    border-color: rgba(74, 127, 184, 0.55);
    box-shadow: 0 0 0 3px rgba(139, 180, 220, 0.65);
}

.gbs-page-registry .gbs-pr-save-btn,
.gbs-page-registry .gbs-pr-footer-bar .gbs-btn-primary {
    background: linear-gradient(135deg, var(--gbs-ud-blue-light) 0%, var(--gbs-ud-blue) 45%, var(--gbs-ud-blue-light) 100%) !important;
    border: none !important;
    box-shadow: 0 6px 20px rgba(74, 127, 184, 0.35);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.gbs-page-registry .gbs-pr-save-btn:hover,
.gbs-page-registry .gbs-pr-footer-bar .gbs-btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 28px rgba(56, 189, 248, 0.45);
}

.gbs-page-registry .gbs-pr-table-wrap {
    border-color: rgba(139, 180, 220, 0.5);
    box-shadow: 0 12px 40px rgba(74, 127, 184, 0.08);
}

.gbs-page-registry .gbs-pr-table__th,
.gbs-page-registry .gbs-pr-table__row td,
.gbs-page-registry .gbs-pr-table__cat td {
    border-color: var(--gbs-ud-blue-light);
}

.gbs-page-registry .gbs-pr-table__th {
    color: var(--gbs-ud-blue);
    background: rgba(139, 180, 220, 0.45);
    text-shadow: none;
    white-space: normal;
    padding: 0.4rem 0.25rem;
    font-size: 0.58rem;
}

.gbs-page-registry .gbs-pr-table__th--id {
    white-space: nowrap;
}

.gbs-page-registry .gbs-pr-table__row td {
    padding: 0.3rem 0.22rem;
}

.gbs-page-registry .gbs-pr-table__th--num {
    width: 3.75rem;
    min-width: 0;
    max-width: 3.75rem;
}

.gbs-page-registry .gbs-pr-table__cell--num {
    background: rgba(139, 180, 220, 0.14);
}

.gbs-page-registry .gbs-pr-tbl-input--num {
    border-color: var(--gbs-ud-blue-light) !important;
    background: #fff !important;
    color: var(--gbs-ud-blue);
}

.gbs-page-registry .gbs-pr-tbl-input--num:focus {
    border-color: var(--gbs-ud-blue) !important;
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
}

.gbs-page-registry .gbs-pr-table__cat td {
    font-size: 0.72rem;
    color: var(--gbs-ud-blue);
    border-bottom: 1px solid rgba(139, 180, 220, 0.35);
}

.gbs-page-registry .gbs-pr-table__cat:nth-of-type(4n + 1) td {
    background: linear-gradient(90deg, rgba(139, 180, 220, 0.14) 0%, rgba(139, 180, 220, 0.28) 55%, rgba(139, 180, 220, 0.5) 100%);
}

.gbs-page-registry .gbs-pr-table__cat:nth-of-type(4n + 3) td {
    background: linear-gradient(90deg, rgba(139, 180, 220, 0.12) 0%, rgba(139, 180, 220, 0.28) 55%, rgba(139, 180, 220, 0.45) 100%);
}


.gbs-page-registry .gbs-pr-table__row:hover td {
    background: linear-gradient(90deg, rgba(139, 180, 220, 0.9) 0%, #fff 100%) !important;
}

.gbs-page-registry .gbs-pr-table__row--highlight td {
    background: linear-gradient(90deg, rgba(139, 180, 220, 0.28) 0%, rgba(139, 180, 220, 0.14) 50%, #fff 100%) !important;
}

.gbs-page-registry .gbs-pr-page__id {
    background: none;
    color: #334155;
    box-shadow: none;
    padding: 0;
    font-weight: 600;
}

.gbs-page-registry .gbs-pr-badge--linked {
    background: linear-gradient(135deg, var(--gbs-ud-blue-light), var(--gbs-ud-blue));
    color: #fff;
    box-shadow: 0 2px 6px rgba(74, 127, 184, 0.35);
}

/* Show-in-menu checkbox column */
.gbs-page-registry .gbs-pr-table__row td.gbs-pr-table__cb .gbs-pr-tbl-cb__input:checked + .gbs-pr-tbl-cb__box {
    border-color: var(--gbs-ud-blue);
    background: linear-gradient(145deg, var(--gbs-ud-blue-light) 0%, var(--gbs-ud-blue) 100%);
    box-shadow: inset 0 0 0 2px #fff, 0 2px 8px rgba(37, 99, 235, 0.4);
}

.gbs-page-registry .gbs-pr-table__cell--perm .gbs-pr-tbl-select,
.gbs-page-registry .gbs-pr-tbl-select--view {
    background-color: #f0f9ff;
    border-color: rgba(139, 180, 220, 0.55);
}

.gbs-page-registry .gbs-pr-tbl-input--test {
    background: linear-gradient(180deg, rgba(139, 180, 220, 0.14), rgba(139, 180, 220, 0.28));
    border-color: rgba(139, 180, 220, 0.55);
    font-weight: 800;
    color: #1d4ed8;
}

.gbs-page-registry .gbs-pr-expand-btn.is-open {
    background: linear-gradient(145deg, rgba(139, 180, 220, 0.28), rgba(139, 180, 220, 0.45));
    border-color: var(--gbs-ud-blue-light);
}

.gbs-page-registry .gbs-pr-detail-panel {
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.gbs-page-registry .gbs-pr-add {
    border-color: rgba(139, 180, 220, 0.65);
    background: linear-gradient(180deg, rgba(139, 180, 220, 0.92) 0%, #fff 100%);
}

.gbs-page-registry .gbs-pr-add__summary {
    color: var(--gbs-ud-blue);
}

.gbs-page-registry .gbs-pr-dirty {
    background: linear-gradient(135deg, rgba(139, 180, 220, 0.14), rgba(139, 180, 220, 0.45));
    border-color: var(--gbs-ud-blue-light);
    color: #1d4ed8;
    animation: gbs-pr-pulse 2s ease-in-out infinite;
}

@keyframes gbs-pr-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.75; }
}

.gbs-page-registry .gbs-pr-flag:has(input:checked) {
    border-color: rgba(74, 127, 184, 0.45);
    background: linear-gradient(135deg, rgba(139, 180, 220, 0.14), rgba(139, 180, 220, 0.28));
    color: #1d4ed8;
}

.gbs-page-registry--dirty .gbs-pr-save-btn {
    box-shadow: 0 0 0 3px rgba(139, 180, 220, 0.75), 0 6px 20px rgba(74, 127, 184, 0.35);
}

.gbs-page-registry .gbs-pr-footer-bar {
    border-color: rgba(139, 180, 220, 0.45);
    background: linear-gradient(180deg, rgba(139, 180, 220, 0.14) 0%, #fff 100%);
}

/* Page registry: near full-screen content area */
main.gbs-page-container:has(.gbs-page-registry--fullscreen) {
    padding-left: clamp(0.35rem, 1vw, 0.65rem);
    padding-right: clamp(0.35rem, 1vw, 0.65rem);
    padding-top: 0.35rem;
    padding-bottom: 0.65rem;
    max-width: 100%;
}

main.gbs-page-container:has(.gbs-page-registry--fullscreen) > nav {
    margin-bottom: 0.35rem;
}

.gbs-page-registry--fullscreen {
    padding: 0.5rem 0.35rem 0.85rem;
    max-width: none;
    width: 100%;
}

.gbs-page-registry--fullscreen .gbs-pr-header {
    margin-bottom: 0.75rem;
    padding: 0.65rem 0.85rem 0.75rem;
}

.gbs-page-registry--fullscreen .gbs-pr-stats {
    margin-bottom: 0.75rem;
}

.gbs-page-registry--fullscreen .gbs-pr-table-wrap {
    max-height: calc(100dvh - 11.5rem);
    overflow: auto;
}

.gbs-page-registry--fullscreen .gbs-pr-table {
    width: 100%;
    min-width: 0;
}

.gbs-page-registry--fullscreen .gbs-pr-table-wrap {
    overflow-x: hidden;
}

.gbs-page-iframe-wrap {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - 10rem);
}

.gbs-page-iframe {
    flex: 1 1 auto;
    width: 100%;
    min-height: 32rem;
    border: 0;
    border-radius: 0.5rem;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

@keyframes gbs-dispatch-section-in {
    from {
        opacity: 0;
        transform: translateY(14px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes gbs-tag-pop {
    0% {
        opacity: 0;
        transform: scale(0.82);
    }
    70% {
        transform: scale(1.04);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes gbs-tag-out {
    to {
        opacity: 0;
        transform: scale(0.85);
    }
}

@keyframes gbs-dropdown-in {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* —— Dispatch staff register (professional form) —— */
.gbs-dispatch-reg {
    max-width: 52rem;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding-bottom: 2rem;
}

.gbs-dispatch-reg--pro {
    max-width: 56rem;
    padding-bottom: 3rem;
}

.gbs-dispatch-reg--pro::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -1;
    background:
        radial-gradient(ellipse 80% 50% at 50% -10%, rgba(139, 180, 220, 0.12), transparent 55%),
        radial-gradient(ellipse 60% 40% at 100% 20%, rgba(74, 127, 184, 0.06), transparent 50%);
}

.gbs-dispatch-reg__anim-hero {
    opacity: 0;
    animation: gbs-dispatch-section-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-dispatch-reg__anim-1,
.gbs-dispatch-reg__anim-2,
.gbs-dispatch-reg__anim-3,
.gbs-dispatch-reg__anim-4,
.gbs-dispatch-reg__anim-5 {
    opacity: 0;
    animation: gbs-dispatch-section-in 0.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-dispatch-reg__anim-1 { animation-delay: 0.08s; }
.gbs-dispatch-reg__anim-2 { animation-delay: 0.14s; }
.gbs-dispatch-reg__anim-3 { animation-delay: 0.2s; }
.gbs-dispatch-reg__anim-4 { animation-delay: 0.26s; }
.gbs-dispatch-reg__anim-5 { animation-delay: 0.32s; }

@media (prefers-reduced-motion: reduce) {
    .gbs-dispatch-reg__anim-hero,
    .gbs-dispatch-reg__anim-1,
    .gbs-dispatch-reg__anim-2,
    .gbs-dispatch-reg__anim-3,
    .gbs-dispatch-reg__anim-4,
    .gbs-dispatch-reg__anim-5 {
        opacity: 1;
        animation: none;
    }

    .gbs-proj-tags__chip--pop,
    .gbs-proj-tags__chip--out,
    .gbs-proj-tags__dropdown.is-open {
        animation: none;
    }
}

.gbs-dispatch-reg__hero {
    padding: 1.25rem 1.5rem 1.35rem;
    background: linear-gradient(135deg, #fff5f8 0%, #fff 55%, #f8fafc 100%);
    box-shadow: 0 4px 24px -6px rgba(74, 127, 184, 0.15), 0 1px 3px rgba(15, 23, 42, 0.06);
}

.gbs-dispatch-reg__hero-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}

.gbs-dispatch-reg__back {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #64748b;
    text-decoration: none;
    transition: color 0.15s ease;
}

.gbs-dispatch-reg__back:hover {
    color: var(--gbs-ud-blue);
}

.gbs-dispatch-reg__badge {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #94a3b8;
    background: #f1f5f9;
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
}

.gbs-dispatch-reg__title {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.gbs-dispatch-reg__intro {
    margin: 0.35rem 0 0;
    font-size: 0.875rem;
    line-height: 1.55;
    color: #64748b;
}

.gbs-dispatch-reg__steps {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.5rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.gbs-dispatch-reg__step {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.55rem 0.3rem 0.3rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(139, 180, 220, 0.45);
    font-size: 0.6875rem;
    font-weight: 600;
    color: #9d174d;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gbs-dispatch-reg__step:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(74, 127, 184, 0.18);
}

.gbs-dispatch-reg__step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 999px;
    background: var(--gbs-dispatch);
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
}

.gbs-dispatch-reg__step-label {
    max-width: 8rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (min-width: 768px) {
    .gbs-dispatch-reg__step-label {
        max-width: none;
    }
}

.gbs-dispatch-reg__alert {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
}

.gbs-dispatch-reg__alert--error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
}

.gbs-dispatch-reg__alert--warn {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #b45309;
}

.gbs-dispatch-reg__form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.gbs-dispatch-reg__section {
    padding: 1.25rem 1.4rem 1.35rem;
    background: #fff;
    box-shadow: 0 2px 16px -4px rgba(15, 23, 42, 0.08), 0 0 0 1px rgba(226, 232, 240, 0.8);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.gbs-dispatch-reg--pro .gbs-dispatch-reg__section:hover {
    box-shadow: 0 8px 28px -8px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(139, 180, 220, 0.35);
}

.gbs-dispatch-reg__section--projects {
    border-color: rgba(139, 180, 220, 0.55);
    background: linear-gradient(180deg, #fff 0%, #fffafb 100%);
    box-shadow: 0 4px 20px -6px rgba(74, 127, 184, 0.15), 0 0 0 1px rgba(139, 180, 220, 0.5);
}

.gbs-dispatch-reg__section-head {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

.gbs-dispatch-reg__section-icon {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    background: #f1f5f9;
    color: #475569;
    font-size: 0.8125rem;
    font-weight: 700;
}

.gbs-dispatch-reg__section-icon--accent {
    background: linear-gradient(135deg, rgba(139, 180, 220, 0.35), rgba(139, 180, 220, 0.15));
    color: var(--gbs-ud-blue);
}

.gbs-dispatch-reg__section-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
}

.gbs-dispatch-reg__section-desc {
    margin: 0.2rem 0 0;
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.45;
}

.gbs-dispatch-reg__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem 1rem;
}

.gbs-dispatch-reg__grid--1 {
    grid-template-columns: 1fr;
}

.gbs-dispatch-reg__grid--dispatch-extra {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px dashed #e2e8f0;
}

.gbs-dispatch-reg__field {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    min-width: 0;
}

.gbs-dispatch-reg__field--full {
    grid-column: 1 / -1;
}

.gbs-dispatch-reg__label {
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dispatch-reg__req {
    color: #e11d48;
    font-style: normal;
}

.gbs-dispatch-reg .gbs-dispatch-reg__input,
.gbs-dispatch-reg .gbs-dispatch-reg__input.gbs-input {
    display: block;
    width: 100%;
    min-height: 2.75rem;
    padding: 0.6rem 0.9rem;
    font-size: 0.9rem;
    line-height: 1.4;
    color: #0f172a;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.gbs-dispatch-reg .gbs-dispatch-reg__input--select {
    appearance: auto;
    cursor: pointer;
}

.gbs-dispatch-reg .gbs-dispatch-reg__input--readonly {
    background: #f8fafc;
    color: #64748b;
    cursor: default;
    box-shadow: none;
}

.gbs-dispatch-reg .gbs-dispatch-reg__input:focus {
    outline: none;
    border-color: var(--gbs-dispatch);
    box-shadow: 0 0 0 3px rgba(139, 180, 220, 0.45), inset 0 1px 2px rgba(15, 23, 42, 0.04);
    transform: translateY(-1px);
}

.gbs-dispatch-reg__field:focus-within .gbs-dispatch-reg__label {
    color: var(--gbs-ud-blue);
}

.gbs-dispatch-reg--pro .gbs-btn-primary.gbs-dispatch-reg__submit {
    background: var(--gbs-dispatch);
    box-shadow: var(--gbs-m3-elevation-1);
}

.gbs-dispatch-reg--pro .gbs-btn-primary.gbs-dispatch-reg__submit:hover {
    background: var(--gbs-brand-light);
    box-shadow: var(--gbs-m3-elevation-2);
}

.gbs-dispatch-reg__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.65rem;
    padding: 1rem 1.25rem;
    position: sticky;
    bottom: 0.75rem;
    z-index: 5;
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(8px);
    box-shadow: 0 -4px 24px rgba(15, 23, 42, 0.06);
}

.gbs-dispatch-reg__submit {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.gbs-dispatch-reg__cancel {
    text-decoration: none;
}

@media (max-width: 640px) {
    .gbs-dispatch-reg__grid {
        grid-template-columns: 1fr;
    }
}

/* —— Project tag picker (dispatch register / eval) —— */
.gbs-proj-picker-wrap {
    margin-top: 0.35rem;
}

.gbs-proj-tags {
    margin-top: 0.35rem;
}

.gbs-proj-tags__panel {
    padding: 0;
    border: none;
    background: transparent;
    box-shadow: none;
}

.gbs-proj-tags__head {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.35rem;
}

.gbs-proj-tags__count {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gbs-ud-blue);
    background: rgba(139, 180, 220, 0.2);
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
}

.gbs-proj-tags__combo {
    position: relative;
}

.gbs-proj-tags__box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
    min-height: 2.75rem;
    padding: 0.4rem 0.55rem;
    border: 1px solid #000;
    border-radius: 0.5rem;
    background: #fff;
    cursor: text;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gbs-proj-tags__box:focus-within {
    border-color: #000;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.15);
}

.gbs-proj-tags__box--readonly {
    cursor: default;
    background: #f8fafc;
}

.gbs-proj-tags__chips {
    display: contents;
}

.gbs-proj-tags__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    max-width: 100%;
    font-size: 0.75rem;
    font-weight: 600;
    color: #000;
    background: linear-gradient(180deg, rgba(139, 180, 220, 0.14), rgba(139, 180, 220, 0.28));
    border: 1px solid #000;
    border-radius: 999px;
    padding: 0.2rem 0.35rem 0.2rem 0.6rem;
    line-height: 1.2;
}

.gbs-proj-tags__chip--pop {
    animation: gbs-tag-pop 0.35s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.gbs-proj-tags__chip--out {
    animation: gbs-tag-out 0.2s ease forwards;
}

.gbs-proj-tags__chip-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 12rem;
}

.gbs-proj-tags__chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 999px;
    background: transparent;
    color: #000;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}

.gbs-proj-tags__chip-remove:hover {
    background: rgba(0, 0, 0, 0.08);
    color: #000;
}

.gbs-proj-tags__input {
    flex: 1 1 8rem;
    min-width: 6rem;
    border: none;
    outline: none;
    background: transparent;
    font-size: 0.875rem;
    padding: 0.25rem 0.15rem;
    color: #0f172a;
}

.gbs-proj-tags__input::placeholder {
    color: #94a3b8;
}

.gbs-proj-tags__dropdown {
    position: absolute;
    z-index: 40;
    left: 0;
    right: 0;
    top: calc(100% + 0.25rem);
    max-height: 14rem;
    overflow-y: auto;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 0.5rem;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
    padding: 0.3rem;
}

.gbs-proj-tags__dropdown.is-open {
    animation: gbs-dropdown-in 0.22s ease forwards;
}

.gbs-proj-tags__dropdown-empty {
    margin: 0.5rem;
    font-size: 0.8125rem;
    color: #94a3b8;
    text-align: center;
}

.gbs-proj-tags__opt {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.1rem;
    width: 100%;
    text-align: left;
    padding: 0.5rem 0.65rem;
    border: none;
    border-radius: 0.375rem;
    background: transparent;
    cursor: pointer;
    font: inherit;
}

.gbs-proj-tags__opt:hover,
.gbs-proj-tags__opt.is-active {
    background: #fff5f8;
}

.gbs-proj-tags__opt-label {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #0f172a;
}

.gbs-proj-tags__opt-meta {
    font-size: 0.6875rem;
    color: #64748b;
}

.gbs-proj-tags__empty {
    margin: 0.35rem 0 0;
    font-size: 0.8125rem;
    color: #94a3b8;
}

.gbs-proj-tags__hint {
    margin: 0.4rem 0 0;
    font-size: 0.6875rem;
    color: #94a3b8;
    line-height: 1.4;
}

.gbs-proj-tags__hidden {
    display: none;
}

/* ── Dashboard (pale & clear colorful analytics UI) ── */
@keyframes gbs-dash-banner-shine {
    0% { transform: translateX(-120%) skewX(-12deg); opacity: 0; }
    12% { opacity: 0.45; }
    100% { transform: translateX(220%) skewX(-12deg); opacity: 0; }
}

@keyframes gbs-dash-orb-float {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(6px, -8px) scale(1.04); }
}

.gbs-main-column main:has(.gbs-dash) {
    position: relative;
    overflow: visible;
    --gbs-dash-blue: #5d82c1;
    --gbs-dash-blue-pale: #9db4e0;
    --gbs-dash-green: #44782d;
    --gbs-dash-green-light: #83a935;
    --gbs-dash-olive: #8e7e2c;
    --gbs-dash-chartreuse: #b5b132;
    background:
        radial-gradient(ellipse 90% 60% at 0% 0%, rgba(93, 130, 193, 0.12) 0%, transparent 55%),
        radial-gradient(ellipse 75% 55% at 100% 0%, rgba(131, 169, 53, 0.1) 0%, transparent 52%),
        radial-gradient(ellipse 70% 50% at 50% 100%, rgba(181, 177, 50, 0.08) 0%, transparent 48%),
        linear-gradient(155deg, #f5f8fc 0%, #f4f7f0 38%, #f8faf5 68%, #f0f4fb 100%);
}

.gbs-dash {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.35rem;
    max-width: 88rem;
    margin: 0 auto;
    padding-bottom: 0.5rem;
    z-index: 1;
    --gbs-dash-border-w: 4px;
    --gbs-dash-border-w-sm: 3px;
    /* Semantic state colors — each border role uses a distinct hue */
    --gbs-dash-color-danger: #dc2626;
    --gbs-dash-color-warning: #d97706;
    --gbs-dash-color-caution: #6366f1;
    --gbs-dash-color-success: #22c55e;
    --gbs-dash-color-info: #0284c7;
    --gbs-dash-color-staff: #1d4ed8;
    --gbs-dash-color-dispatch: #9333ea;
    --gbs-dash-color-companies: #15803d;
    --gbs-dash-color-projects: #0e7490;
    --gbs-dash-color-internal-co: #84cc16;
    --gbs-dash-color-ce: #ea580c;
    --gbs-dash-color-banner: #44782d;
    --gbs-dash-color-neutral: #94a3b8;
}

.gbs-dash__ambient {
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.gbs-dash__ambient-orb {
    position: absolute;
    border-radius: 999px;
    filter: blur(72px);
    opacity: 0.55;
    animation: gbs-dash-orb-float 14s ease-in-out infinite;
}

.gbs-dash__ambient-orb--1 {
    width: 28rem;
    height: 28rem;
    top: -8rem;
    left: -6rem;
    background: rgba(93, 130, 193, 0.26);
}

.gbs-dash__ambient-orb--2 {
    width: 22rem;
    height: 22rem;
    top: 20%;
    right: -5rem;
    background: rgba(131, 169, 53, 0.2);
    animation-delay: 2s;
}

.gbs-dash__ambient-orb--3 {
    width: 18rem;
    height: 18rem;
    bottom: 5%;
    left: 30%;
    background: rgba(181, 177, 50, 0.16);
    animation-delay: 4s;
}

.gbs-dash-banner {
    position: relative;
    overflow: hidden;
    border-radius: 1.5rem;
    border: 1px solid var(--gbs-sidebar-border);
    background: var(--gbs-sidebar-bg);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.08) inset,
        0 12px 32px rgba(15, 23, 42, 0.18);
}

.gbs-dash-banner__bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.gbs-dash-banner__grid {
    position: absolute;
    inset: 0;
    opacity: 0.18;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.06) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.5) 0%, transparent 100%);
}

.gbs-dash-banner__orb {
    position: absolute;
    border-radius: 999px;
    filter: blur(48px);
    opacity: 0.45;
}

.gbs-dash-banner__orb--1 {
    width: 16rem;
    height: 16rem;
    top: -5rem;
    right: -3rem;
    background: rgba(255, 255, 255, 0.12);
}

.gbs-dash-banner__orb--2 {
    width: 11rem;
    height: 11rem;
    bottom: -4rem;
    left: 8%;
    background: rgba(255, 255, 255, 0.1);
}

.gbs-dash-banner__orb--3 {
    width: 9rem;
    height: 9rem;
    top: 30%;
    right: 32%;
    background: rgba(255, 255, 255, 0.08);
    animation: gbs-dash-orb-float 9s ease-in-out infinite;
}

.gbs-dash-banner__orb--4 {
    width: 7rem;
    height: 7rem;
    bottom: 15%;
    right: 12%;
    background: rgba(255, 255, 255, 0.1);
    animation: gbs-dash-orb-float 11s ease-in-out 1.5s infinite reverse;
}

.gbs-dash-banner__shine {
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, transparent 38%, rgba(255, 255, 255, 0.14) 50%, transparent 62%);
    animation: gbs-dash-banner-shine 5.5s ease-in-out infinite;
    pointer-events: none;
}

.gbs-dash-banner__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    margin-bottom: 0.65rem;
    border-radius: 0.9rem;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(12px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.gbs-dash-banner__badge-svg {
    width: 1.35rem;
    height: 1.35rem;
}

.gbs-dash-banner__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.25rem 1.5rem;
    padding: 1.85rem 1.5rem;
}

@media (min-width: 640px) {
    .gbs-dash-banner__content {
        padding: 2.15rem 2rem 2.25rem;
    }
}

.gbs-dash-banner__main {
    min-width: 0;
    flex: 1;
}

.gbs-dash-banner__eyebrow {
    margin: 0 0 0.45rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.88);
}

.gbs-dash-banner__title {
    margin: 0;
    font-size: clamp(1.5rem, 2.8vw, 2rem);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -0.03em;
    color: #ffffff;
    text-shadow: 0 1px 2px rgba(26, 45, 70, 0.28);
}

.gbs-dash-banner__subtitle {
    margin: 0.7rem 0 0;
    max-width: 42rem;
    font-size: 0.9375rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.88);
}

.gbs-dash-banner__meta {
    flex-shrink: 0;
}

.gbs-dash-banner__time {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(226, 232, 240, 0.92);
    padding: 0.5rem 0.9rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(10px);
}

.gbs-dash-stat-cards {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 1rem;
    margin-top: -0.5rem;
}

@media (min-width: 640px) {
    .gbs-dash-stat-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.gbs-dash-stat-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-height: 4.75rem;
    padding: 0.85rem 1rem;
    border-radius: 1.25rem;
    overflow: hidden;
    color: #1e293b;
    border: var(--gbs-dash-border-w) solid var(--gbs-dash-card-border-color, var(--gbs-dash-color-staff));
    background: #ffffff;
    box-shadow: none;
    transition: transform 0.22s ease, border-color 0.22s ease;
}

.gbs-dash-stat-card::before,
.gbs-dash-stat-card::after {
    display: none;
}

.gbs-dash-stat-card--staff {
    --gbs-dash-card-border-color: var(--gbs-dash-color-staff);
    --gbs-dash-card-border-accent: var(--gbs-dash-color-staff);
}

.gbs-dash-stat-card--companies {
    --gbs-dash-card-border-color: var(--gbs-dash-color-companies);
    --gbs-dash-card-border-accent: var(--gbs-dash-color-companies);
}

.gbs-dash-stat-card--projects {
    --gbs-dash-card-border-color: var(--gbs-dash-color-projects);
    --gbs-dash-card-border-accent: var(--gbs-dash-color-projects);
}

.gbs-dash-stat-card:hover,
.gbs-dash-stat-card:focus-visible {
    transform: translateY(-4px) scale(1.01);
    box-shadow: none;
}

.gbs-dash-stat-card:focus-visible {
    outline: none;
}

.gbs-dash-stat-card:active {
    transform: translateY(-1px) scale(1);
    box-shadow: none;
}

.gbs-dash-stat-card__glow {
    display: none;
}

.gbs-dash-stat-card__icon {
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 1rem;
    color: var(--gbs-dash-card-border-accent, var(--gbs-dash-color-staff));
    border: 2px solid var(--gbs-dash-card-border-color, var(--gbs-dash-color-staff));
    background: color-mix(in srgb, var(--gbs-dash-card-border-color, var(--gbs-dash-color-staff)) 12%, #ffffff);
    box-shadow: none;
}

.gbs-dash-stat-card__icon .gbs-dash-kpi__svg {
    width: 1.35rem;
    height: 1.35rem;
}

.gbs-dash-stat-card__body {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.gbs-dash-stat-card__value {
    font-size: clamp(1.25rem, 2vw, 1.6rem);
    font-weight: 800;
    line-height: 1.05;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
    text-shadow: none;
}

.gbs-dash-stat-card__label {
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--gbs-dash-card-border-accent, #334155);
    line-height: 1.4;
    opacity: 1;
}

.gbs-dash-stat-card--staff .gbs-dash-stat-card__label {
    color: #1e40af;
}

.gbs-dash-stat-card--companies .gbs-dash-stat-card__label {
    color: #166534;
}

.gbs-dash-stat-card--projects .gbs-dash-stat-card__label {
    color: #0e7490;
}

.gbs-dash-summary-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0.85rem;
}

@media (min-width: 540px) {
    .gbs-dash-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 900px) {
    .gbs-dash-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 1280px) {
    .gbs-dash-summary-grid {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }
}

.gbs-dash-stat-card--link {
    text-decoration: none;
    cursor: pointer;
}

.gbs-dash-stat-card--link:hover {
    transform: translateY(-4px) scale(1.01);
}

.gbs-dash-stat-card__sub {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #64748b;
    line-height: 1.35;
}

.gbs-dash-stat-card--with-status {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    text-decoration: none;
    cursor: default;
}

.gbs-dash-stat-card--with-status:hover,
.gbs-dash-stat-card--with-status:focus-within {
    transform: translateY(-4px) scale(1.01);
}

.gbs-dash-stat-card__main {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 1rem 1.1rem 0.65rem;
    text-decoration: none;
    color: inherit;
}

.gbs-dash-stat-card__status {
    border-top: 1px solid rgba(148, 163, 184, 0.22);
    padding: 0.45rem 0.75rem 0.65rem;
}

.gbs-dash-stat-card__status-title {
    margin: 0 0 0.35rem;
    font-size: 0.5625rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #94a3b8;
}

.gbs-dash-stat-card__status-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.gbs-dash-stat-card__status-link {
    display: grid;
    grid-template-columns: 0.45rem minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.35rem 0.45rem;
    padding: 0.18rem 0.25rem;
    border-radius: 0.35rem;
    text-decoration: none;
    color: #475569;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1.2;
}

.gbs-dash-stat-card__status-link:hover,
.gbs-dash-stat-card__status-link:focus-visible {
    background: rgba(148, 163, 184, 0.14);
    color: #0f172a;
}

.gbs-dash-stat-card__status-swatch {
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 999px;
    flex-shrink: 0;
}

.gbs-dash-stat-card__status-label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-dash-stat-card__status-count {
    font-variant-numeric: tabular-nums;
    color: #334155;
}

.gbs-dash-stat-card__status-pct {
    font-variant-numeric: tabular-nums;
    color: #94a3b8;
    min-width: 2.4rem;
    text-align: right;
}

.gbs-dash-stat-card--dispatch {
    --gbs-dash-card-border-color: var(--gbs-dash-color-dispatch);
    --gbs-dash-card-border-accent: var(--gbs-dash-color-dispatch);
}

.gbs-dash-stat-card--dispatch .gbs-dash-stat-card__label {
    color: #7e22ce;
}

.gbs-dash-stat-card--internal-co {
    --gbs-dash-card-border-color: var(--gbs-dash-color-internal-co);
    --gbs-dash-card-border-accent: var(--gbs-dash-color-internal-co);
}

.gbs-dash-stat-card--internal-co .gbs-dash-stat-card__label {
    color: #4d7c0f;
}

.gbs-dash-stat-card--ce-gt-em {
    --gbs-dash-card-border-color: var(--gbs-dash-color-ce);
    --gbs-dash-card-border-accent: var(--gbs-dash-color-ce);
}

.gbs-dash-stat-card--ce-gt-em .gbs-dash-stat-card__label {
    color: #c2410c;
}

.gbs-dash-ic-panel {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.gbs-dash-ic-panel__open {
    margin-left: auto;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--gbs-dash-color-ce);
    text-decoration: none;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    border: 2px solid var(--gbs-dash-color-ce);
    background: color-mix(in srgb, var(--gbs-dash-color-ce) 8%, #ffffff);
    transition: background 0.2s ease, box-shadow 0.2s ease;
}

.gbs-dash-ic-panel__open:hover {
    background: color-mix(in srgb, var(--gbs-dash-color-ce) 14%, #ffffff);
    box-shadow: 0 2px 10px color-mix(in srgb, var(--gbs-dash-color-ce) 22%, transparent);
}

.gbs-dash-ic-panel__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem;
}

@media (min-width: 640px) {
    .gbs-dash-ic-panel__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.gbs-dash-ic-card {
    border-radius: 1rem;
    border: var(--gbs-dash-border-w) solid var(--gbs-dash-color-ce);
    background: #ffffff;
    padding: 0.85rem 0.95rem;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.gbs-dash-ic-card--ce {
    --gbs-dash-ic-accent: #ca8a04;
    border-color: var(--gbs-dash-ic-accent);
}

.gbs-dash-ic-card--gt {
    --gbs-dash-ic-accent: #d97706;
    border-color: var(--gbs-dash-ic-accent);
}

.gbs-dash-ic-card--me {
    --gbs-dash-ic-accent: #b45309;
    border-color: var(--gbs-dash-ic-accent);
}

.gbs-dash-ic-card--em {
    --gbs-dash-ic-accent: #b45309;
    border-color: var(--gbs-dash-ic-accent);
}

.gbs-dash-ic-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.5rem;
    margin-bottom: 0.65rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-dash-ic-card__code {
    font-size: 1.125rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--gbs-dash-ic-accent, var(--gbs-dash-color-ce));
}

.gbs-dash-ic-card__name {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
}

.gbs-dash-ic-card__stats {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.gbs-dash-ic-card__stat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.gbs-dash-ic-card__stat dt {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-ic-card__stat dd {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
}

.gbs-dash-ic-card__stat dd a {
    color: inherit;
    text-decoration: none;
}

.gbs-dash-ic-card__stat dd a:hover {
    color: var(--gbs-dash-ic-accent, var(--gbs-dash-color-ce));
    text-decoration: underline;
}

.gbs-dash-ic-card__stat--primary dd {
    font-size: 1.25rem;
    color: var(--gbs-dash-ic-accent, var(--gbs-dash-color-ce));
}

.gbs-dash-ic-panel__totals {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1.25rem;
    padding: 0.65rem 0.95rem;
    border-radius: 0.75rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-dash-color-ce);
    background: color-mix(in srgb, var(--gbs-dash-color-ce) 6%, #ffffff);
    font-size: 0.75rem;
    color: #475569;
}

.gbs-dash-ic-panel__totals-label {
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #92400e;
}

.gbs-dash-ic-panel__totals-item strong {
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-ic-panel__totals-item--primary strong {
    color: var(--gbs-dash-color-ce);
    font-size: 0.9375rem;
}

/* Dashboard — Sales / GR / SS owner summary */
.gbs-dash-owner-panel {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.gbs-dash-owner-panel__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem;
}

@media (min-width: 640px) {
    .gbs-dash-owner-panel__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.gbs-dash-owner-card {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    border-radius: 1rem;
    border: var(--gbs-dash-border-w) solid var(--gbs-dash-owner-accent, #5d82c1);
    background: #ffffff;
    padding: 0.85rem 0.95rem;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.gbs-dash-owner-card:hover {
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
    transform: translateY(-1px);
}

.gbs-dash-owner-card--sales {
    --gbs-dash-owner-accent: #5d82c1;
}

.gbs-dash-owner-card--gr {
    --gbs-dash-owner-accent: #44782d;
}

.gbs-dash-owner-card--ss {
    --gbs-dash-owner-accent: #8e7e2c;
}

.gbs-dash-owner-card__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.5rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-dash-owner-card__code {
    font-size: 1.125rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: var(--gbs-dash-owner-accent);
}

.gbs-dash-owner-card__title {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
}

.gbs-dash-owner-card__stats {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 1;
}

.gbs-dash-owner-card__stat {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
}

.gbs-dash-owner-card__stat dt {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-owner-card__stat dd {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
}

.gbs-dash-owner-card__stat--primary dd {
    font-size: 1.25rem;
    color: var(--gbs-dash-owner-accent);
}

.gbs-dash-owner-card__open {
    align-self: flex-start;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--gbs-dash-owner-accent);
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    border: 2px solid var(--gbs-dash-owner-accent);
    background: color-mix(in srgb, var(--gbs-dash-owner-accent) 8%, #ffffff);
    transition: background 0.2s ease;
}

.gbs-dash-owner-card:hover .gbs-dash-owner-card__open {
    background: color-mix(in srgb, var(--gbs-dash-owner-accent) 14%, #ffffff);
}

.gbs-dash-hub-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

@media (min-width: 1100px) {
    .gbs-dash-hub-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gbs-dash-hub--wide {
        grid-column: 1 / -1;
    }
}

.gbs-dash-hub {
    border-radius: 1.25rem;
    border: var(--gbs-dash-border-w) solid var(--gbs-dash-hub-border-color, var(--gbs-dash-color-neutral));
    background: #ffffff;
    box-shadow: 0 6px 24px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.gbs-dash-hub--internal {
    --gbs-dash-hub-border-color: var(--gbs-dash-color-staff);
    --gbs-dash-hub-accent: var(--gbs-dash-color-staff);
}

.gbs-dash-hub--temporary {
    --gbs-dash-hub-border-color: #ca8a04;
    --gbs-dash-hub-accent: #ca8a04;
}

.gbs-dash-hub--temporary .gbs-dash-hub__head--dispatch {
    --gbs-dash-hub-head-tint: #eab308;
    --gbs-dash-hub-head-color: #ca8a04;
}

.gbs-dash-hub--client {
    --gbs-dash-hub-border-color: var(--gbs-dash-color-companies);
    --gbs-dash-hub-accent: var(--gbs-dash-color-companies);
}

.gbs-dash-hub:hover {
    box-shadow:
        0 0 0 2px color-mix(in srgb, var(--gbs-dash-hub-border-color) 30%, transparent),
        0 10px 32px color-mix(in srgb, var(--gbs-dash-hub-border-color) 18%, transparent);
}

.gbs-dash-hub__head {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    padding: 1rem 1.15rem 1.05rem;
    border-bottom: none;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--gbs-dash-hub-head-tint, #5d82c1) 7%, #ffffff) 0%,
        #ffffff 100%
    );
}

.gbs-dash-hub__head::after {
    display: none;
}

.gbs-dash-hub__head--staff {
    --gbs-dash-hub-head-tint: var(--gbs-dash-color-staff);
    --gbs-dash-hub-head-color: var(--gbs-dash-color-staff);
}

.gbs-dash-hub__head--dispatch {
    --gbs-dash-hub-head-tint: var(--gbs-dash-color-dispatch);
    --gbs-dash-hub-head-color: var(--gbs-dash-color-dispatch);
}

.gbs-dash-hub__head--companies {
    --gbs-dash-hub-head-tint: var(--gbs-dash-color-companies);
    --gbs-dash-hub-head-color: var(--gbs-dash-color-companies);
}

.gbs-dash-hub__title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: #0f172a;
}

.gbs-dash-hub__hint {
    margin: 0.25rem 0 0;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.45;
}

.gbs-dash-hub__meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
}

.gbs-dash-hub__total {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-hub--internal .gbs-dash-hub__total {
    color: #1e40af;
}

.gbs-dash-hub--temporary .gbs-dash-hub__total {
    color: #a16207;
}

.gbs-dash-hub--client .gbs-dash-hub__total {
    color: #166534;
}

.gbs-dash-hub__link {
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--gbs-dash-hub-accent, var(--gbs-dash-color-staff));
    text-decoration: none;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    border: 2px solid var(--gbs-dash-hub-border-color, var(--gbs-dash-color-staff));
    background: color-mix(in srgb, var(--gbs-dash-hub-border-color, var(--gbs-dash-color-staff)) 8%, #ffffff);
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.gbs-dash-hub__link:hover {
    background: color-mix(in srgb, var(--gbs-dash-hub-border-color, var(--gbs-dash-color-staff)) 14%, #ffffff);
    box-shadow: 0 2px 10px color-mix(in srgb, var(--gbs-dash-hub-border-color) 22%, transparent);
}

.gbs-dash-hub__link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--gbs-dash-hub-accent, #5d82c1) 30%, transparent);
}

.gbs-dash-attention {
    margin: 0 1rem;
    padding: 0.85rem;
    border-radius: 0.85rem;
    border: var(--gbs-dash-border-w) solid var(--gbs-dash-attention-border-color, var(--gbs-dash-color-warning));
    background: var(--gbs-dash-attention-bg, #fffbeb);
    box-shadow: 0 2px 12px color-mix(in srgb, var(--gbs-dash-attention-border-color) 18%, transparent);
    transition: background 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.gbs-dash-attention:hover {
    box-shadow: 0 4px 18px color-mix(in srgb, var(--gbs-dash-attention-border-color) 28%, transparent);
}

/* neutral = alerts panel default (amber) */
.gbs-dash-attention--neutral {
    --gbs-dash-attention-bg: #fffbeb;
    --gbs-dash-attention-border-color: var(--gbs-dash-color-warning);
}

/* critical = attention needed / expired → RED */
.gbs-dash-attention--critical {
    --gbs-dash-attention-bg: #fef2f2;
    --gbs-dash-attention-border-color: var(--gbs-dash-color-danger);
    animation: gbs-dash-attention-pulse 2.8s ease-in-out infinite;
}

/* warning = expiring soon → AMBER */
.gbs-dash-attention--warning {
    --gbs-dash-attention-bg: #fffbeb;
    --gbs-dash-attention-border-color: var(--gbs-dash-color-warning);
}

/* caution = review needed → BLUE */
.gbs-dash-attention--caution {
    --gbs-dash-attention-bg: #eff6ff;
    --gbs-dash-attention-border-color: var(--gbs-dash-color-caution);
}

/* ok = no issues → GREEN */
.gbs-dash-attention--ok {
    --gbs-dash-attention-bg: #f0fdf4;
    --gbs-dash-attention-border-color: var(--gbs-dash-color-success);
}

.gbs-dash-attention--critical .gbs-dash-attention__title {
    color: #b91c1c;
}

.gbs-dash-attention--warning .gbs-dash-attention__title {
    color: #b45309;
}

.gbs-dash-attention--caution .gbs-dash-attention__title {
    color: #1d4ed8;
}

.gbs-dash-attention--ok .gbs-dash-attention__title {
    color: #15803d;
}

@keyframes gbs-dash-attention-pulse {
    0%, 100% {
        box-shadow: 0 2px 12px color-mix(in srgb, var(--gbs-dash-color-danger) 22%, transparent);
    }
    50% {
        box-shadow:
            0 4px 20px color-mix(in srgb, var(--gbs-dash-color-danger) 35%, transparent),
            0 0 0 3px color-mix(in srgb, var(--gbs-dash-color-danger) 28%, transparent);
    }
}

@media (prefers-reduced-motion: reduce) {
    .gbs-dash-attention--critical {
        animation: none;
    }
}

.gbs-dash-attention__head {
    margin-bottom: 0.65rem;
}

.gbs-dash-attention__title {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 800;
    color: #6a5f20;
}

.gbs-dash-attention__hint {
    margin: 0.2rem 0 0;
    font-size: 0.6875rem;
    color: #64748b;
}

.gbs-dash-hub-chart {
    padding: 0.65rem 1rem 1.1rem;
}

.gbs-dash-hub-chart__lead {
    margin: 0 0 0.65rem;
    padding: 0 0.15rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.45;
}

.gbs-dash-jurisdiction-aside__head {
    margin-bottom: 0.55rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-dash-jurisdiction-aside__label {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 800;
    color: #1e40af;
}

.gbs-dash-jurisdiction-aside__meta {
    margin: 0.2rem 0 0;
    font-size: 0.75rem;
    font-weight: 700;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-jurisdiction-aside__hint {
    margin: 0.25rem 0 0;
    font-size: 0.625rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.4;
}

.gbs-dash-hub--internal .gbs-dash-hub-chart__aside {
    border-color: var(--gbs-dash-color-staff);
    background: color-mix(in srgb, var(--gbs-dash-color-staff) 5%, #ffffff);
}

.gbs-dash-hub--temporary .gbs-dash-hub-chart__aside {
    border-color: var(--gbs-dash-hub-border-color, var(--gbs-dash-color-dispatch));
    background: color-mix(in srgb, var(--gbs-dash-hub-accent, var(--gbs-dash-color-dispatch)) 5%, #ffffff);
}

.gbs-dash-hub--temporary .gbs-dash-jurisdiction-aside__label {
    color: #a16207;
}

.gbs-dash-hub--client .gbs-dash-hub-chart__aside {
    border-color: var(--gbs-dash-color-companies);
    background: color-mix(in srgb, var(--gbs-dash-color-companies) 5%, #ffffff);
}

.gbs-dash-hub--client .gbs-dash-jurisdiction-aside__label {
    color: #166534;
}

.gbs-dash-pct-group--client-metrics .gbs-dash-pct-group__title {
    color: #15803d;
}

.gbs-dash-pct-group--residence .gbs-dash-pct-group__title {
    color: #b91c1c;
}

.gbs-dash-pct-group--jurisdiction .gbs-dash-pct-group__title {
    color: #7e22ce;
}

.gbs-dash-hub-chart--with-aside {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.85rem 1rem;
}

.gbs-dash-hub-chart--with-aside .gbs-dash-hub-chart__wrap {
    flex: 1 1 14rem;
    min-width: min(100%, 14rem);
}

.gbs-dash-hub-chart__aside {
    flex: 0 1 13.5rem;
    min-width: 11.5rem;
    max-width: 100%;
    padding: 0.5rem 0.65rem;
    border-radius: 0.75rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-dash-color-staff);
    background: color-mix(in srgb, var(--gbs-dash-color-staff) 5%, #ffffff);
    overflow: auto;
    max-height: 28rem;
}

.gbs-dash-pct-group + .gbs-dash-pct-group {
    margin-top: 0.65rem;
    padding-top: 0.65rem;
    border-top: 1px solid #e2e8f0;
}

.gbs-dash-pct-group__title {
    margin: 0 0 0.4rem;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #334155;
}

.gbs-dash-pct-group--gender .gbs-dash-pct-group__title {
    color: #1d4ed8;
}

.gbs-dash-pct-group--nationality .gbs-dash-pct-group__title {
    color: #15803d;
}

.gbs-dash-pct-group--age .gbs-dash-pct-group__title {
    color: #0f766e;
}

.gbs-dash-pct-group__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
}

.gbs-dash-pct-group__item {
    display: grid;
    grid-template-columns: 0.5rem 1fr auto auto;
    align-items: center;
    gap: 0.35rem 0.4rem;
    font-size: 0.6875rem;
    line-height: 1.35;
}

.gbs-dash-pct-group__swatch {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
    flex-shrink: 0;
}

.gbs-dash-pct-group__label {
    color: #475569;
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-dash-pct-group__pct {
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-pct-group__count {
    font-weight: 700;
    color: #64748b;
    font-variant-numeric: tabular-nums;
    font-size: 0.625rem;
}

.gbs-dash-hub-chart__wrap {
    position: relative;
    min-height: 14rem;
    height: auto;
}

.gbs-dash-hub-chart__wrap--bar {
    max-width: 100%;
}

.gbs-dash-hub-chart__wrap--doughnut {
    max-width: 26rem;
    margin: 0 auto;
}

.gbs-dash-hub-chart__wrap--polar,
.gbs-dash-hub-chart__wrap--radar {
    max-width: 100%;
}

.gbs-dash-hub--wide .gbs-dash-hub-chart__wrap--radar {
    min-height: 20rem;
}

.gbs-dash-mini-charts {
    display: grid;
    gap: 0.85rem;
    padding: 0.85rem 1rem 1.1rem;
}

.gbs-dash-mini-charts--3 {
    grid-template-columns: minmax(0, 1fr);
}

.gbs-dash-mini-charts--4 {
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 640px) {
    .gbs-dash-mini-charts--3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (min-width: 520px) {
    .gbs-dash-mini-charts--4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.gbs-dash-mini-chart {
    padding: 0.65rem;
    border-radius: 0.85rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-dash-mini-border-color, var(--gbs-dash-color-neutral));
    background: #f8fafc;
    transition: background 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.gbs-dash-mini-chart:hover {
    background: #ffffff;
    box-shadow: 0 4px 14px color-mix(in srgb, var(--gbs-dash-mini-border-color) 16%, transparent);
}

.gbs-dash-hub--internal .gbs-dash-mini-chart {
    --gbs-dash-mini-border-color: var(--gbs-dash-color-staff);
}

.gbs-dash-hub--temporary .gbs-dash-mini-chart {
    --gbs-dash-mini-border-color: var(--gbs-dash-hub-border-color, var(--gbs-dash-color-dispatch));
}

.gbs-dash-hub--temporary.gbs-dash-hub--attention-critical .gbs-dash-mini-chart {
    --gbs-dash-mini-border-color: var(--gbs-dash-color-danger);
}

.gbs-dash-hub--temporary.gbs-dash-hub--attention-warning .gbs-dash-mini-chart {
    --gbs-dash-mini-border-color: var(--gbs-dash-color-warning);
}

.gbs-dash-hub--temporary.gbs-dash-hub--attention-caution .gbs-dash-mini-chart {
    --gbs-dash-mini-border-color: var(--gbs-dash-color-caution);
}

.gbs-dash-hub--temporary.gbs-dash-hub--attention-ok .gbs-dash-mini-chart {
    --gbs-dash-mini-border-color: var(--gbs-dash-color-success);
}

.gbs-dash-hub--client .gbs-dash-mini-chart,
.gbs-dash-hub--client .gbs-dash-client-chart__canvas-wrap {
    --gbs-dash-mini-border-color: var(--gbs-dash-color-companies);
}

.gbs-dash-mini-chart__title {
    margin: 0 0 0.5rem;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #475569;
    text-align: center;
}

.gbs-dash-mini-chart--residence .gbs-dash-mini-chart__title {
    color: #b91c1c;
}

.gbs-dash-mini-chart--gender .gbs-dash-mini-chart__title {
    color: #1d4ed8;
}

.gbs-dash-mini-chart--nationality .gbs-dash-mini-chart__title {
    color: #15803d;
}

.gbs-dash-mini-chart--jurisdiction .gbs-dash-mini-chart__title {
    color: #7e22ce;
}

.gbs-dash-mini-chart__wrap {
    height: 10.5rem;
    position: relative;
}

.gbs-dash-mini-chart__wrap--bar {
    height: auto;
    min-height: 10.5rem;
}

.gbs-dash-mini-chart__stats {
    margin: 0.55rem 0 0;
    padding: 0.45rem 0.35rem 0;
    list-style: none;
    border-top: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 0.32rem;
}

.gbs-dash-mini-chart__stat {
    display: grid;
    grid-template-columns: 0.55rem 1fr auto auto;
    align-items: center;
    gap: 0.35rem 0.45rem;
    font-size: 0.6875rem;
    line-height: 1.35;
}

.gbs-dash-mini-chart__stat-swatch {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    flex-shrink: 0;
}

.gbs-dash-mini-chart__stat-label {
    color: #475569;
    font-weight: 600;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-dash-mini-chart__stat-pct {
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-mini-chart__stat-count {
    font-weight: 700;
    color: #64748b;
    font-variant-numeric: tabular-nums;
    font-size: 0.625rem;
    min-width: 1.75rem;
    text-align: right;
}

.gbs-dash-mini-chart__stats--flat {
    margin-top: 0.35rem;
    padding-top: 0;
    border-top: none;
}

.gbs-dispatch-residence-attention {
    margin: 0;
    width: auto;
    max-width: min(100%, 46rem);
    min-width: 0;
    padding: 0.75rem 0.85rem;
    flex: 0 0 auto;
}

.gbs-card--dispatch .gbs-dispatch-residence-attention {
    max-width: min(100%, 46rem);
}

.gbs-attention-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.5rem;
}

.gbs-attention-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.35rem;
    padding: 0.7rem 0.45rem 0.65rem;
    border-radius: 0.75rem;
    border: 2px solid #e2e8f0;
    background: #ffffff;
    min-width: 0;
}

.gbs-attention-stat--expired {
    border-color: #fecaca;
    background: #fffafa;
}

.gbs-attention-stat--expiring {
    border-color: #fed7aa;
    background: #fffbeb;
}

.gbs-attention-stat--review {
    border-color: #bfdbfe;
    background: #f8fafc;
}

.gbs-attention-stat--ok {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.gbs-attention-stat__icon .gbs-residence-status {
    width: 2.35rem;
    height: 2.35rem;
}

.gbs-attention-stat__icon .gbs-icon--status {
    width: 1.35rem;
    height: 1.35rem;
}

.gbs-attention-stat__label {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.35;
    color: #334155;
}

.gbs-attention-stat__metrics {
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.1rem;
    line-height: 1.2;
}

.gbs-attention-stat__pct {
    font-size: 1.125rem;
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-attention-stat__count {
    font-size: 0.8125rem;
    font-weight: 700;
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

@media (max-width: 640px) {
    .gbs-attention-stat-grid {
        grid-template-columns: repeat(4, minmax(5.25rem, 1fr));
        overflow-x: auto;
        padding-bottom: 0.15rem;
        scrollbar-width: thin;
    }
}

.gbs-card--dispatch .gbs-dispatch-residence-attention .gbs-dash-attention__head {
    margin-bottom: 0.5rem;
}

.gbs-dispatch-residence-attention .gbs-dash-attention__title,
.gbs-dispatch-staff-summary-panels .gbs-residence-legend__title {
    margin: 0 0 0.35rem;
    font-size: 1.0625rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0.01em;
    color: #0f172a;
}

.gbs-dispatch-residence-attention .gbs-dash-attention__title {
    white-space: nowrap;
}

.gbs-dispatch-residence-attention.gbs-dash-attention--critical .gbs-dash-attention__title {
    color: #b91c1c;
}

.gbs-dispatch-residence-attention.gbs-dash-attention--warning .gbs-dash-attention__title {
    color: #b45309;
}

.gbs-dispatch-residence-attention.gbs-dash-attention--caution .gbs-dash-attention__title {
    color: #1d4ed8;
}

.gbs-dispatch-residence-attention.gbs-dash-attention--ok .gbs-dash-attention__title {
    color: #15803d;
}

.gbs-dispatch-staff-summary-panels .gbs-residence-legend__title {
    color: #1e3a5f;
    white-space: nowrap;
}

.gbs-card--dispatch .gbs-dispatch-residence-attention .gbs-dash-attention__hint {
    margin-top: 0.15rem;
    font-size: 0.75rem;
    line-height: 1.35;
}

.gbs-dispatch-staff-hero {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.gbs-dispatch-staff-hero__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.65rem 1rem;
}

.gbs-dispatch-staff-hero__title {
    flex: 1 1 12rem;
    min-width: 0;
}

.gbs-dispatch-staff-hero__register {
    flex-shrink: 0;
}

.gbs-dispatch-staff-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-shrink: 0;
}

.gbs-dispatch-staff-hero__factory {
    flex-shrink: 0;
}

.gbs-dispatch-staff-hero__panels,
.gbs-dispatch-staff-summary-panels {
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.5rem;
    width: fit-content;
    max-width: 100%;
}

.gbs-dispatch-staff-summary-panels {
    margin-top: 0.15rem;
}

.gbs-dispatch-staff-summary-panels .gbs-residence-legend--inline,
.gbs-dispatch-staff-hero__panels .gbs-residence-legend--inline {
    margin-left: 0;
    width: auto;
    flex: 0 0 auto;
}

@media (max-width: 479px) {
    .gbs-dispatch-staff-hero__panels,
    .gbs-dispatch-staff-summary-panels {
        flex-flow: column nowrap;
        width: 100%;
    }

    .gbs-dispatch-staff-summary-panels .gbs-dispatch-residence-attention,
    .gbs-dispatch-staff-summary-panels .gbs-residence-legend--inline {
        width: 100%;
        max-width: 100%;
    }
}

.gbs-dispatch-staff-hero__legend-only {
    display: flex;
    justify-content: flex-end;
}

.gbs-dispatch-staff-hero__legend-only .gbs-residence-legend--inline {
    max-width: 14rem;
}

.gbs-residence-legend--inline {
    flex: 0 0 auto;
    width: auto;
    max-width: 13.5rem;
}

.gbs-dispatch-staff-summary-panels .gbs-residence-legend--inline {
    min-width: 17rem;
    max-width: none;
}

/* Temporary staff list — address column (avoid single-character vertical wrap) */
.gbs-dispatch-staff-col--address {
    min-width: 14rem;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
    vertical-align: top;
    line-height: 1.45;
}

/* Resizable list tables (drag header edge) */
.gbs-table-wrap--col-resize > table {
    table-layout: fixed;
}

.gbs-table-wrap--col-resize > table thead th {
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-table-wrap--col-resize > table tbody td {
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-table-wrap--col-resize .gbs-dispatch-staff-col--address {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
}

.gbs-col-resize-handle {
    position: absolute;
    top: 0;
    right: -3px;
    width: 7px;
    height: 100%;
    cursor: col-resize;
    user-select: none;
    touch-action: none;
    z-index: 3;
}

.gbs-col-resize-handle:hover,
.gbs-col-resize-handle.is-dragging {
    background: rgba(59, 130, 246, 0.28);
}

body.gbs-col-resize-active {
    cursor: col-resize !important;
    user-select: none;
}

body.gbs-col-resize-active * {
    cursor: col-resize !important;
}

.gbs-col-resize-hint {
    margin: 0.35rem 0 0;
    font-size: 0.6875rem;
    color: #64748b;
    line-height: 1.45;
}

@media (min-width: 640px) {
    .gbs-residence-legend--inline {
        display: grid;
        grid-template-rows: auto repeat(3, auto);
        gap: 0.35rem;
        align-content: start;
    }
}

.gbs-dash-client-chart {
    padding: 0.85rem 1rem 1.15rem;
}

.gbs-dash-client-chart__canvas-wrap {
    height: clamp(14rem, 42vw, 22rem);
    padding: 0.5rem;
    border-radius: 0.85rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-dash-mini-border-color, var(--gbs-dash-color-companies));
    background: #f8fafc;
    transition: background 0.22s ease, box-shadow 0.22s ease;
}

.gbs-dash-client-chart__canvas-wrap:hover {
    background: #ffffff;
    box-shadow: 0 4px 16px color-mix(in srgb, var(--gbs-dash-mini-border-color) 18%, transparent);
}

.gbs-dash-block {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

.gbs-dash-block__head {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.85rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-dash-block-border-color, var(--gbs-dash-color-staff));
    background: #ffffff;
    box-shadow: 0 2px 12px color-mix(in srgb, var(--gbs-dash-block-border-color) 12%, transparent);
    transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.gbs-dash-block__head:hover {
    box-shadow: 0 4px 16px color-mix(in srgb, var(--gbs-dash-block-border-color) 20%, transparent);
}

.gbs-dash-block__head--overview {
    --gbs-dash-block-border-color: var(--gbs-dash-color-staff);
    --gbs-dash-block-accent: var(--gbs-dash-color-staff);
}

.gbs-dash-block__head--analytics {
    --gbs-dash-block-border-color: var(--gbs-dash-color-info);
    --gbs-dash-block-accent: var(--gbs-dash-color-info);
}

.gbs-dash-block__head--shortcuts {
    --gbs-dash-block-border-color: var(--gbs-dash-color-ce);
    --gbs-dash-block-accent: var(--gbs-dash-color-ce);
}

.gbs-dash-block__accent {
    flex-shrink: 0;
    width: 0.28rem;
    height: 2.25rem;
    margin-top: 0.15rem;
    border-radius: 999px;
    background: var(--gbs-dash-block-border-color, var(--gbs-dash-color-staff));
}

.gbs-dash-block__head--overview .gbs-dash-block__accent {
    background: var(--gbs-dash-color-staff);
}

.gbs-dash-block__head--staff .gbs-dash-block__accent {
    background: var(--gbs-dash-color-companies);
}

.gbs-dash-block__head--shortcuts .gbs-dash-block__accent {
    background: var(--gbs-dash-color-ce);
}

.gbs-dash-block__head--analytics .gbs-dash-block__accent {
    background: var(--gbs-dash-color-info);
}

.gbs-dash-block__title {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #0f172a;
}

.gbs-dash-block__hint {
    margin: 0.25rem 0 0;
    font-size: 0.8125rem;
    color: #64748b;
    line-height: 1.45;
}

.gbs-dash-overview {
    padding: 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

.gbs-dash-block--shortcuts {
    gap: 0.75rem;
    width: 100%;
    max-width: 100%;
    padding: 0.85rem 1rem 1rem;
    border-radius: 0.85rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-dash-color-ce);
    background: #ffffff;
    box-shadow: 0 2px 10px color-mix(in srgb, var(--gbs-dash-color-ce) 14%, transparent);
}

.gbs-dash-block--shortcuts .gbs-dash-block__head {
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    gap: 0.45rem;
    width: auto;
}

.gbs-dash-block--shortcuts .gbs-dash-block__accent {
    width: 0.28rem;
    height: 1.45rem;
    margin-top: 0.12rem;
}

.gbs-dash-block--shortcuts .gbs-dash-block__title {
    font-size: 0.9375rem;
    line-height: 1.3;
}

.gbs-dash-block--shortcuts .gbs-dash-block__hint {
    display: none;
}

.gbs-dash-shortcuts {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(7.25rem, 1fr));
    align-items: stretch;
    gap: 0.65rem;
    padding: 0;
    width: 100%;
    max-width: 100%;
    border-radius: 0;
    background: transparent;
    backdrop-filter: none;
    border: none;
    box-shadow: none;
}

@media (min-width: 768px) {
    .gbs-dash-shortcuts {
        grid-template-columns: repeat(auto-fill, minmax(8.25rem, 1fr));
        gap: 0.75rem;
    }
}

.gbs-dash-shortcuts .gbs-dash-btn {
    position: relative;
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 5.75rem;
    padding: 0.7rem 0.5rem 0.75rem;
    border-radius: 0.85rem;
    border: var(--gbs-dash-border-w-sm) solid var(--gbs-btn-border-color, var(--gbs-dash-color-staff));
    color: #1e293b;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.gbs-dash-shortcuts .gbs-dash-btn:hover {
    transform: translateY(-2px);
    background: color-mix(in srgb, var(--gbs-btn-border-color) 8%, #ffffff);
    box-shadow: 0 4px 14px color-mix(in srgb, var(--gbs-btn-border-color) 22%, transparent);
    color: #0f172a;
}

.gbs-dash-shortcuts .gbs-dash-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--gbs-btn-border-color) 35%, transparent);
}

.gbs-dash-shortcuts .gbs-dash-btn:active {
    transform: translateY(0);
    background: color-mix(in srgb, var(--gbs-btn-border-color) 10%, #ffffff);
}

.gbs-dash-shortcuts .gbs-dash-btn::before,
.gbs-dash-shortcuts .gbs-dash-btn::after {
    display: none;
}

.gbs-dash-shortcuts .gbs-dash-btn--worker {
    --gbs-btn-border-color: var(--gbs-dash-color-dispatch);
    --gbs-btn-grad-a: var(--gbs-dash-color-dispatch);
}

.gbs-dash-shortcuts .gbs-dash-btn--internal {
    --gbs-btn-border-color: var(--gbs-dash-color-staff);
    --gbs-btn-grad-a: var(--gbs-dash-color-staff);
}

.gbs-dash-shortcuts .gbs-dash-btn--companies {
    --gbs-btn-border-color: var(--gbs-dash-color-companies);
    --gbs-btn-grad-a: var(--gbs-dash-color-companies);
}

.gbs-dash-shortcuts .gbs-dash-btn--projects {
    --gbs-btn-border-color: var(--gbs-dash-color-projects);
    --gbs-btn-grad-a: var(--gbs-dash-color-projects);
}

.gbs-dash-shortcuts .gbs-dash-btn--internal-co {
    --gbs-btn-border-color: var(--gbs-dash-color-internal-co);
    --gbs-btn-grad-a: var(--gbs-dash-color-internal-co);
}

.gbs-dash-shortcuts .gbs-dash-btn--salary {
    --gbs-btn-border-color: var(--gbs-dash-color-warning);
    --gbs-btn-grad-a: var(--gbs-dash-color-warning);
}

.gbs-dash-shortcuts .gbs-dash-btn--eval {
    --gbs-btn-border-color: var(--gbs-dash-color-info);
    --gbs-btn-grad-a: var(--gbs-dash-color-info);
}

.gbs-dash-shortcuts .gbs-dash-btn--profile {
    --gbs-btn-border-color: var(--gbs-dash-color-success);
    --gbs-btn-grad-a: var(--gbs-dash-color-success);
}

.gbs-dash-shortcuts .gbs-dash-btn--pic {
    --gbs-btn-border-color: #db2777;
    --gbs-btn-grad-a: #db2777;
}

.gbs-dash-shortcuts .gbs-dash-btn__icon {
    position: relative;
    z-index: 1;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.55rem;
    color: var(--gbs-btn-grad-a, #5d82c1);
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    box-shadow: none;
    margin-bottom: 0;
    flex-shrink: 0;
    transition: background 0.22s ease;
}

.gbs-dash-shortcuts .gbs-dash-btn:hover .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn:focus-visible .gbs-dash-btn__icon {
    background: #f1f5f9;
}

.gbs-dash-shortcuts .gbs-dash-btn__svg {
    width: 1.25rem;
    height: 1.25rem;
}

.gbs-dash-shortcuts .gbs-dash-btn__text {
    position: relative;
    z-index: 1;
    flex: none;
    width: 100%;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    color: #334155;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
}

@media (min-width: 768px) {
    .gbs-dash-shortcuts .gbs-dash-btn {
        min-height: 6.25rem;
        padding: 0.8rem 0.55rem 0.85rem;
    }

    .gbs-dash-shortcuts .gbs-dash-btn__icon {
        width: 2.6rem;
        height: 2.6rem;
    }

    .gbs-dash-shortcuts .gbs-dash-btn__svg {
        width: 1.35rem;
        height: 1.35rem;
    }

    .gbs-dash-shortcuts .gbs-dash-btn__text {
        font-size: 0.75rem;
    }
}

.gbs-dash-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

@media (min-width: 1100px) {
    .gbs-dash-layout:has(.gbs-dash-sidebar) {
        grid-template-columns: minmax(18rem, 24rem) minmax(0, 1fr);
    }
}

.gbs-dash-sidebar {
    min-width: 0;
}

.gbs-dash-main {
    min-width: 0;
}

.gbs-dash-alert-grid {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.gbs-dash-alert-tile {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.65rem;
    min-height: 3.75rem;
    padding: 0.65rem 0.75rem;
    border-radius: 0.85rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    text-align: left;
    overflow: hidden;
    position: relative;
    transition: box-shadow 0.2s ease;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
}

.gbs-dash-alert-tile:hover {
    transform: translateY(-2px) scale(1.01);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.1);
}

.gbs-dash-alert-tile--danger {
    color: #1e293b;
    --gbs-dash-alert-border: #e85d7a;
    --gbs-dash-alert-border-gradient: linear-gradient(135deg, #e85d7a 0%, #f0a060 50%, #8e7e2c 100%);
}

.gbs-dash-alert-tile--warn {
    color: #1e293b;
    --gbs-dash-alert-border: #f0b84a;
    --gbs-dash-alert-border-gradient: linear-gradient(135deg, #f0b84a 0%, #8e7e2c 50%, #b5b132 100%);
}

.gbs-dash-alert-tile--info {
    color: #1e293b;
    --gbs-dash-alert-border: #5d82c1;
    --gbs-dash-alert-border-gradient: linear-gradient(135deg, #5d82c1 0%, #6ec4cc 50%, #9db4e0 100%);
}

.gbs-dash-alert-tile--danger .gbs-dash-alert-tile__count,
.gbs-dash-alert-tile--danger .gbs-dash-alert-tile__label,
.gbs-dash-alert-tile--danger .gbs-dash-alert-tile__icon .gbs-dash-alert__svg,
.gbs-dash-alert-tile--warn .gbs-dash-alert-tile__count,
.gbs-dash-alert-tile--warn .gbs-dash-alert-tile__label,
.gbs-dash-alert-tile--warn .gbs-dash-alert-tile__icon .gbs-dash-alert__svg,
.gbs-dash-alert-tile--info .gbs-dash-alert-tile__count,
.gbs-dash-alert-tile--info .gbs-dash-alert-tile__label,
.gbs-dash-alert-tile--info .gbs-dash-alert-tile__icon .gbs-dash-alert__svg {
    color: #0f172a;
}

.gbs-dash-alert-tile__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.85rem;
    color: var(--gbs-dash-alert-border, #5d82c1);
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.gbs-dash-alert-tile__icon .gbs-dash-alert__svg {
    width: 1.35rem;
    height: 1.35rem;
    color: inherit;
}

.gbs-dash-alert-tile__body {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.gbs-dash-alert-tile__count {
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
    text-shadow: none;
}

.gbs-dash-alert-tile__label {
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.35;
    color: #64748b;
    letter-spacing: 0.02em;
}

.gbs-dash-alerts__title {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 800;
    color: #0f172a;
}

.gbs-dash-alerts__hint {
    margin: 0.35rem 0 0;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.45;
}

/* ── Dashboard charts ── */
.gbs-dash-hero {
    overflow: hidden;
    position: relative;
}

.gbs-dash-hero::before {
    display: none;
}

.gbs-dash-hero__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem 1.5rem;
    margin-bottom: 1.5rem;
}

.gbs-dash-hero__total {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding: 0.65rem 1rem;
    border-radius: 0.875rem;
    background: linear-gradient(135deg, #eff6ff 0%, #f8fafc 100%);
    border: 1px solid rgba(74, 127, 184, 0.18);
    min-width: 7rem;
}

.gbs-dash-hero__total-num {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.1;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.gbs-dash-hero__total-label {
    margin-top: 0.15rem;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-kpi-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.875rem;
}

@media (min-width: 1024px) {
    .gbs-dash-kpi-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 1rem;
    }
}

.gbs-dash-kpi {
    display: flex;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid rgba(148, 163, 184, 0.22);
    background: #fff;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.gbs-dash-kpi:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
}

.gbs-dash-kpi--staff { background: linear-gradient(145deg, #f5f8fc 0%, #eef3fa 100%); }
.gbs-dash-kpi--dispatch { background: linear-gradient(145deg, #eef3fa 0%, #e4edf8 100%); border-color: rgba(93, 130, 193, 0.22); }
.gbs-dash-kpi--companies { background: linear-gradient(145deg, #f2f7ee 0%, #e8f2e2 100%); border-color: rgba(68, 120, 45, 0.2); }
.gbs-dash-kpi--projects { background: linear-gradient(145deg, #f7f6ec 0%, #f0eed8 100%); border-color: rgba(142, 126, 44, 0.2); }

.gbs-dash-kpi__icon {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.75);
    color: #334155;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.gbs-dash-kpi--dispatch .gbs-dash-kpi__icon { color: #5d82c1; }
.gbs-dash-kpi--companies .gbs-dash-kpi__icon { color: #44782d; }
.gbs-dash-kpi--projects .gbs-dash-kpi__icon { color: #8e7e2c; }

.gbs-dash-kpi__icon svg {
    width: 1.35rem;
    height: 1.35rem;
}

.gbs-dash-kpi__body {
    min-width: 0;
    flex: 1;
}

.gbs-dash-kpi__value {
    font-size: 1.65rem;
    font-weight: 800;
    line-height: 1.1;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.gbs-dash-kpi__label {
    margin-top: 0.2rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-kpi__bar {
    margin-top: 0.55rem;
    height: 4px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.22);
    overflow: hidden;
}

.gbs-dash-kpi__bar-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    transition: width 0.6s ease;
}

.gbs-dash-kpi__pct {
    margin-top: 0.25rem;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
}

/* Dashboard quick links — uniform JP-style tiles */
.gbs-dash-actions {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(148, 163, 184, 0.2);
}

@media (min-width: 480px) {
    .gbs-dash-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 768px) {
    .gbs-dash-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0.875rem;
    }
}

.gbs-dash-btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.875rem;
    width: 100%;
    min-height: 3.5rem;
    padding: 0.875rem 1rem 0.875rem 0.875rem;
    border-radius: 0.5rem;
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.4;
    letter-spacing: 0.01em;
    text-decoration: none;
    color: #1e3a5f;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #c5d4e4;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
    transition:
        background 0.15s ease,
        border-color 0.15s ease,
        box-shadow 0.15s ease,
        transform 0.15s ease;
}

.gbs-dash-btn__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.375rem;
    height: 2.375rem;
    border-radius: 0.625rem;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
    color: #475569;
}

.gbs-dash-btn__svg {
    width: 1.25rem;
    height: 1.25rem;
    display: block;
}

.gbs-dash-btn--worker .gbs-dash-btn__icon { color: #5d82c1; background: #eef3fa; }
.gbs-dash-btn--internal .gbs-dash-btn__icon { color: #9db4e0; background: #f0f4fb; }
.gbs-dash-btn--salary .gbs-dash-btn__icon { color: #b5b132; background: #f7f6ec; }
.gbs-dash-btn--eval .gbs-dash-btn__icon { color: #44782d; background: #f2f7ee; }
.gbs-dash-btn--profile .gbs-dash-btn__icon { color: #83a935; background: #f4f8ef; }
.gbs-dash-btn--pic .gbs-dash-btn__icon { color: #8e7e2c; background: #f7f5ea; }

.gbs-dash-btn__text {
    flex: 1;
    min-width: 0;
    text-align: left;
}

.gbs-dash-btn::after {
    content: "";
    flex-shrink: 0;
    width: 0.45rem;
    height: 0.45rem;
    border-top: 2px solid #64748b;
    border-right: 2px solid #64748b;
    transform: rotate(45deg);
    margin-left: auto;
    transition: border-color 0.15s ease;
}

.gbs-dash-btn:hover {
    background: linear-gradient(180deg, #f8fbff 0%, #eef4fa 100%);
    border-color: var(--gbs-brand);
    color: var(--gbs-brand-dark);
    box-shadow: 0 4px 12px rgba(74, 127, 184, 0.14);
    transform: translateY(-1px);
}

.gbs-dash-btn:hover .gbs-dash-btn__icon {
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.1);
}

.gbs-dash-btn:hover::after {
    border-color: var(--gbs-brand);
}

.gbs-dash-btn:focus-visible {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 2px;
}

.gbs-dash-btn:active {
    background: #e8f1f9;
    box-shadow: none;
}

.gbs-dash-charts {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

@media (min-width: 1024px) {
    .gbs-dash-charts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }
}

.gbs-dash-chart-card {
    display: flex;
    flex-direction: column;
    min-height: 17rem;
    padding: 0;
    border-radius: 1.5rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
    overflow: hidden;
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.gbs-dash-chart-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 28px color-mix(in srgb, var(--gbs-dash-chart-border, #5d82c1) 20%, transparent);
}

.gbs-dash-chart-card--bar {
    --gbs-dash-chart-border: #5d82c1;
    --gbs-dash-chart-border-gradient: linear-gradient(135deg, #5d82c1 0%, #3d9ea8 45%, #9db4e0 100%);
}

.gbs-dash-chart-card--donut {
    --gbs-dash-chart-border: #44782d;
    --gbs-dash-chart-border-gradient: linear-gradient(135deg, #44782d 0%, #83a935 45%, #b5b132 100%);
}

.gbs-dash-chart-card--bar::before,
.gbs-dash-chart-card--donut::before {
    display: none;
}

.gbs-dash-chart-card__head {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    margin-bottom: 0;
    text-align: left;
    padding: 1.25rem 1.35rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-chart-card__badge {
    flex-shrink: 0;
    width: 2.75rem;
    height: 2.75rem;
    margin-top: 0.1rem;
    border-radius: 0.9rem;
    color: var(--gbs-dash-chart-border, #5d82c1);
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    box-shadow: none;
}

.gbs-dash-chart-card__badge--bar,
.gbs-dash-chart-card__badge--donut {
    box-shadow: none;
}

.gbs-dash-chart-card__head .gbs-h2 {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.gbs-dash-chart-card__head .text-xs {
    margin-top: 0.3rem;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.45;
}

.gbs-dash-analytics {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    min-width: 0;
}

.gbs-dash-charts--overview {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

@media (min-width: 1024px) {
    .gbs-dash-charts--overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: stretch;
    }
}

.gbs-dash-jurisdiction {
    padding: 0;
    overflow: hidden;
    border-radius: 1.5rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.gbs-dash-jurisdiction:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.12);
}

.gbs-dash-jurisdiction__head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    margin-bottom: 0;
    padding: 1.35rem 1.4rem 1.1rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-jurisdiction__head .gbs-h2 {
    color: #0f172a;
    font-weight: 800;
}

.gbs-dash-jurisdiction__head .text-xs {
    color: #64748b;
}

.gbs-dash-jurisdiction__badge {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.75rem;
    border-radius: 999px;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #44782d;
    background: color-mix(in srgb, #44782d 10%, #ffffff);
    border: 2px solid #44782d;
}

.gbs-dash-jurisdiction__link {
    font-size: 0.75rem;
    font-weight: 700;
    color: #5d82c1;
    text-decoration: none;
    padding: 0.35rem 0.65rem;
    border-radius: 999px;
    background: #ffffff;
    border: 2px solid #5d82c1;
    transition: background 0.15s ease;
}

.gbs-dash-jurisdiction__link:hover {
    color: #ffffff;
    background: #5d82c1;
    text-decoration: none;
}

.gbs-dash-jurisdiction__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
    padding: 1rem 1.25rem 1.35rem;
}

@media (min-width: 960px) {
    .gbs-dash-jurisdiction__body {
        grid-template-columns: minmax(0, 1.15fr) minmax(16rem, 0.85fr);
    }
}

.gbs-dash-jurisdiction__chart {
    padding: 0.75rem;
    border-radius: 1.15rem;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.gbs-dash-jurisdiction-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.5rem 0.75rem;
    padding: 0.75rem 0.85rem;
    border-radius: 1rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    transition: box-shadow 0.15s ease;
}

.gbs-dash-jurisdiction-item__dot {
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 999px;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9);
}

.gbs-dash-jurisdiction-item:hover {
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.gbs-dash-jurisdiction-item__name {
    font-size: 0.875rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.3;
}

.gbs-dash-jurisdiction-item__stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 3.5rem;
    padding: 0.35rem 0.45rem;
    border-radius: 0.65rem;
    text-decoration: none;
    background: #ffffff;
    border: 2px solid #5d82c1;
    transition: background 0.15s ease, transform 0.15s ease;
}

.gbs-dash-jurisdiction-item__stat--projects {
    background: #ffffff;
    border-color: #83a935;
}

.gbs-dash-jurisdiction-item__stat:hover {
    background: color-mix(in srgb, #5d82c1 8%, #ffffff);
    transform: scale(1.04);
}

.gbs-dash-jurisdiction-item__stat--projects:hover {
    background: color-mix(in srgb, #83a935 8%, #ffffff);
}

.gbs-dash-jurisdiction-item__num {
    font-size: 0.9375rem;
    font-weight: 800;
    line-height: 1.1;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-jurisdiction-item__lbl {
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #64748b;
    line-height: 1.2;
    text-align: center;
}

.gbs-dash-jurisdiction__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
}

.gbs-dash-chart-wrap--jurisdiction {
    height: clamp(12rem, 36vw, 22rem);
    min-height: 12rem;
}

.gbs-dash-jurisdiction-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    max-height: 22rem;
    overflow: auto;
}

.gbs-dash-jurisdiction-item__stats {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-shrink: 0;
}

.gbs-dash-jurisdiction-item__stat--plain {
    cursor: default;
}

.gbs-dash-info-panels {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem;
}

@media (min-width: 960px) {
    .gbs-dash-info-panels {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-items: start;
    }
}

.gbs-dash-info-panel {
    position: relative;
    padding: 0;
    border-radius: 1.15rem;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.08);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.gbs-dash-info-panel:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}

.gbs-dash-info-panel--employee {
    --gbs-dash-panel-border: #5d82c1;
    --gbs-dash-panel-border-gradient: linear-gradient(135deg, #5d82c1 0%, #3d9ea8 50%, #9db4e0 100%);
}

.gbs-dash-info-panel--temporary {
    --gbs-dash-panel-border: #83a935;
    --gbs-dash-panel-border-gradient: linear-gradient(135deg, #83a935 0%, #b5b132 50%, #8e7e2c 100%);
}

.gbs-dash-info-panel__head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 0.75rem;
    margin-bottom: 0;
    padding: 0.7rem 0.85rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-info-panel__intro {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
    flex: 1;
}

.gbs-dash-info-panel__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 0.65rem;
    color: var(--gbs-dash-panel-border, #5d82c1);
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    box-shadow: none;
}

.gbs-dash-info-panel__icon--employee,
.gbs-dash-info-panel__icon--temporary {
    color: var(--gbs-dash-panel-border, #5d82c1);
    background: color-mix(in srgb, var(--gbs-dash-panel-border, #5d82c1) 12%, #ffffff);
}

.gbs-dash-info-panel__title {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.gbs-dash-info-panel__hint {
    margin: 0.15rem 0 0;
    font-size: 0.6875rem;
    color: #64748b;
    line-height: 1.35;
}

.gbs-dash-info-panel__hero-num {
    font-size: 1.375rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--gbs-dash-panel-border, #5d82c1);
    text-shadow: none;
    background: none;
    -webkit-text-fill-color: currentColor;
}

.gbs-dash-info-panel__link {
    display: inline-flex;
    align-items: center;
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--gbs-dash-panel-border, #5d82c1);
    text-decoration: none;
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    background: #ffffff;
    border: 2px solid var(--gbs-dash-panel-border, #5d82c1);
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
}

.gbs-dash-info-panel__link:hover {
    background: var(--gbs-dash-panel-border, #5d82c1);
    color: #ffffff;
}

.gbs-dash-info-panel__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.55rem;
    padding: 0.65rem 0.85rem 0.8rem;
    background: #ffffff;
}

.gbs-dash-info-block__title {
    margin: 0 0 0.4rem;
    font-size: 0.5625rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-info-item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    align-items: center;
    gap: 0.12rem 0.4rem;
    padding: 0.4rem 0.5rem;
    border-radius: 0.55rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
    transition: box-shadow 0.15s ease;
}

.gbs-dash-info-item:hover {
    background: #ffffff;
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.gbs-dash-info-item__label {
    font-size: 0.6875rem;
    font-weight: 700;
    color: #334155;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    grid-column: 2;
}

.gbs-dash-info-item__count,
.gbs-dash-info-item__link {
    font-size: 0.8125rem;
    font-weight: 800;
    color: #0f172a;
    text-decoration: none;
    line-height: 1;
}

.gbs-dash-info-item__pct {
    font-size: 0.5625rem;
    font-weight: 700;
    color: var(--gbs-info-color, #5d82c1);
    padding: 0.1rem 0.35rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--gbs-info-color, #5d82c1) 12%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--gbs-info-color, #5d82c1) 35%, #ffffff);
}

.gbs-dash-info-item__bar {
    grid-column: 1 / -1;
    height: 3px;
    border-radius: 999px;
    background: #e2e8f0;
    overflow: hidden;
}

.gbs-dash-info-item__bar-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
    transition: width 0.35s ease;
    background: var(--gbs-info-color, #5d82c1) !important;
    box-shadow: none;
}

.gbs-dash-chart-body {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1rem 1.15rem;
    margin: 0 1rem 1rem;
    border-radius: 1.15rem;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.gbs-dash-donut-layout {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    padding: 0.75rem 1rem 1.15rem;
    margin: 0 1rem 1rem;
    border-radius: 1.15rem;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
}

.gbs-dash-info-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(7.75rem, 1fr));
    gap: 0.35rem;
}

.gbs-dash-info-list--cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gbs-dash-info-list--cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 479px) {
    .gbs-dash-info-list--cols-2,
    .gbs-dash-info-list--cols-3 {
        grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
    }
}

.gbs-dash-info-item__dot {
    display: block;
    width: 0.35rem;
    height: 0.35rem;
    border-radius: 999px;
    grid-row: 1 / span 2;
    align-self: center;
}

.gbs-dash-info-item__code {
    font-weight: 800;
    font-size: 0.6875rem;
}

.gbs-dash-info-item__sub {
    display: none;
}

.gbs-dash-info-item__meta {
    display: flex;
    align-items: baseline;
    gap: 0.25rem;
    font-variant-numeric: tabular-nums;
    grid-column: 3;
    grid-row: 1;
}

.gbs-dash-info-panel__svg {
    width: 1.35rem;
    height: 1.35rem;
}

.gbs-dash-info-panel__meta {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.45rem;
    flex-shrink: 0;
}

.gbs-dash-info-panel__total {
    display: none;
}

.gbs-dash-info-block--full {
    grid-column: 1 / -1;
}

.gbs-dash-chart-wrap--bar {
    height: 18rem;
    max-width: 100%;
    margin: 0 auto;
}

.gbs-dash-chart-wrap--donut {
    width: 14rem;
    height: 14rem;
    margin: 0 auto;
}

.gbs-dash-chart-wrap {
    position: relative;
    width: 100%;
}

.gbs-dash-donut-chart {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.gbs-dash-donut-center {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    text-align: center;
}

.gbs-dash-legend {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 17.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.gbs-dash-legend__link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    text-decoration: none;
    color: inherit;
}

.gbs-dash-legend__link:hover {
    text-decoration: none;
}

.gbs-dash-legend__dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 999px;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
}

.gbs-dash-legend__nums {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-donut-center__value {
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
    background: none;
    -webkit-text-fill-color: #0f172a;
    text-shadow: none;
}

.gbs-dash-donut-center__label {
    margin-top: 0.25rem;
    max-width: 5.5rem;
    font-size: 0.5625rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
    line-height: 1.3;
}

.gbs-dash-legend__item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.85rem;
    border-radius: 0.85rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    transition: box-shadow 0.15s ease;
}

.gbs-dash-legend__item:has(.gbs-dash-legend__link:not(.gbs-dash-legend__link--static)):hover {
    background: #ffffff;
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.gbs-dash-legend__label {
    flex: 1;
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    line-height: 1.3;
}

.gbs-dash-legend__value {
    font-size: 0.9375rem;
    font-weight: 800;
    color: #0f172a;
}

.gbs-dash-legend__pct {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
}

.gbs-dash-legend-group__title {
    flex: 1;
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-legend-group__total {
    font-size: 0.8125rem;
    font-weight: 800;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-hero__intro {
    min-width: 0;
    flex: 1;
}

.gbs-dash-hero__eyebrow {
    margin: 0 0 0.35rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--gbs-brand-dark, #1e3a5f);
}

.gbs-dash-hero__meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
    flex-shrink: 0;
}

.gbs-dash-hero__time {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: rgba(248, 250, 252, 0.95);
    border: 1px solid rgba(148, 163, 184, 0.22);
}

@media (min-width: 768px) {
    .gbs-dash-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.gbs-dash-kpi-sections {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

@media (min-width: 768px) {
    .gbs-dash-kpi-sections {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        align-items: stretch;
    }
}

.gbs-dash-kpi-section {
    position: relative;
    min-width: 0;
    min-height: 0;
    padding: 0;
    border-radius: 1.15rem;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}

.gbs-dash-kpi-section--staff {
    --gbs-dash-section-border: #5d82c1;
    --gbs-dash-section-border-gradient: linear-gradient(135deg, #5d82c1 0%, #6ec4cc 50%, #9db4e0 100%);
}

.gbs-dash-kpi-section--companies {
    --gbs-dash-section-border: #44782d;
    --gbs-dash-section-border-gradient: linear-gradient(135deg, #44782d 0%, #83a935 50%, #b5b132 100%);
}

.gbs-dash-kpi-section--projects {
    --gbs-dash-section-border: #3d9ea8;
    --gbs-dash-section-border-gradient: linear-gradient(135deg, #3d9ea8 0%, #8e7e2c 50%, #b5b132 100%);
}

.gbs-dash-kpi-section:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.12);
}

.gbs-dash-kpi-section__head {
    padding: 0.75rem 0.85rem 0.55rem;
    margin-bottom: 0;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-kpi-section__head-main {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.6rem;
    min-width: 0;
}

.gbs-dash-kpi-section__title {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: -0.01em;
    color: #0f172a;
}

.gbs-dash-kpi-section__hero-num {
    font-size: clamp(1.35rem, 2.5vw, 1.75rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--gbs-dash-section-border, #5d82c1);
    font-variant-numeric: tabular-nums;
    text-shadow: none;
}

.gbs-dash-kpi-section__total {
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-kpi-section__items {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.55rem 0.75rem 0.75rem;
    background: #ffffff;
}

.gbs-dash-kpi-section .gbs-dash-kpi {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.65rem;
    min-height: 4.25rem;
    padding: 0.65rem 0.75rem;
    border-radius: 0.85rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    color: #1e293b;
    text-decoration: none;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}

.gbs-dash-kpi-section .gbs-dash-kpi:hover {
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.gbs-dash-kpi-section .gbs-dash-kpi--staff {
    --gbs-kpi-border-accent: #5d82c1;
    --gbs-kpi-border-gradient: linear-gradient(135deg, #5d82c1, #6ec4cc, #9db4e0);
}

.gbs-dash-kpi-section .gbs-dash-kpi--dispatch {
    --gbs-kpi-border-accent: #9db4e0;
    --gbs-kpi-border-gradient: linear-gradient(135deg, #9db4e0, #5d82c1, #6ec4cc);
}

.gbs-dash-kpi-section .gbs-dash-kpi--companies {
    --gbs-kpi-border-accent: #44782d;
    --gbs-kpi-border-gradient: linear-gradient(135deg, #44782d, #83a935, #b5b132);
}

.gbs-dash-kpi-section .gbs-dash-kpi--internal {
    --gbs-kpi-border-accent: #83a935;
    --gbs-kpi-border-gradient: linear-gradient(135deg, #83a935, #b5b132, #8e7e2c);
}

.gbs-dash-kpi-section .gbs-dash-kpi--projects {
    --gbs-kpi-border-accent: #3d9ea8;
    --gbs-kpi-border-gradient: linear-gradient(135deg, #3d9ea8, #8e7e2c, #b5b132);
}

.gbs-dash-kpi-section .gbs-dash-kpi__icon {
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 0.65rem;
    color: var(--gbs-kpi-border-accent, #5d82c1);
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    box-shadow: none;
}

.gbs-dash-kpi-section .gbs-dash-kpi__svg {
    width: 1.25rem;
    height: 1.25rem;
}

.gbs-dash-kpi-section .gbs-dash-kpi__body {
    flex: 1;
    min-width: 0;
}

.gbs-dash-kpi-section .gbs-dash-kpi__value {
    font-size: 1.125rem;
    font-weight: 800;
    line-height: 1;
    color: #0f172a;
    letter-spacing: -0.03em;
    text-shadow: none;
}

.gbs-dash-kpi-section .gbs-dash-kpi__label {
    margin-top: 0.15rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-kpi-section .gbs-dash-kpi__bar {
    width: 100%;
    margin-top: 0.5rem;
    height: 5px;
    border-radius: 999px;
    background: #e2e8f0;
}

.gbs-dash-kpi-section .gbs-dash-kpi__bar-fill {
    background: var(--gbs-kpi-border-accent, #5d82c1) !important;
    border-radius: inherit;
    box-shadow: none;
}

.gbs-dash-kpi-section .gbs-dash-kpi__pct,
.gbs-dash-kpi-section .gbs-dash-kpi__open {
    font-size: 0.625rem;
    font-weight: 700;
    color: var(--gbs-kpi-border-accent, #5d82c1);
}

.gbs-dash-ic-breakdown {
    margin-top: 0.15rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e2e8f0;
}

.gbs-dash-ic-breakdown__label {
    margin: 0 0 0.65rem;
    font-size: 0.5625rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-dash-ic-row {
    padding: 0.75rem 0.8rem;
    border-radius: 1rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-ic-row + .gbs-dash-ic-row {
    margin-top: 0.5rem;
}

.gbs-dash-ic-row__code {
    font-size: 0.8125rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #0f172a;
}

.gbs-dash-ic-row__name {
    font-size: 0.625rem;
    font-weight: 600;
    color: #64748b;
}

.gbs-dash-ic-stat__link,
.gbs-dash-ic-stat__plain {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
    padding: 0.45rem 0.3rem;
    border-radius: 0.65rem;
    text-decoration: none;
    min-width: 0;
}

.gbs-dash-ic-stat__link {
    border: 1px solid #e2e8f0;
    background: #ffffff;
    transition: box-shadow 0.15s ease;
}

.gbs-dash-ic-stat__link:hover {
    background: #f8fafc;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
}

.gbs-dash-ic-stat__plain {
    border: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-ic-stat__value {
    font-size: 0.9375rem;
    font-weight: 800;
    line-height: 1;
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-ic-stat__label {
    font-size: 0.5rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.72);
    text-align: center;
    line-height: 1.2;
}

.gbs-dash-ic-row__head {
    display: flex;
    align-items: baseline;
    gap: 0.35rem;
    margin-bottom: 0.45rem;
    min-width: 0;
}

.gbs-dash-ic-row__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
}

.gbs-dash-legend__link--static {
    cursor: default;
}

.gbs-dash-legend__nums--ic {
    gap: 0.25rem;
}

.gbs-dash-legend__nums--ic .gbs-dash-legend__pct {
    font-size: 0.625rem;
}

.gbs-dash-kpi__foot--solo {
    justify-content: flex-end;
}

.gbs-dash-legend-groups {
    width: 100%;
    max-width: 20rem;
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
}

@media (min-width: 1280px) {
    .gbs-dash-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.gbs-dash-kpi--link {
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.gbs-dash-kpi--link:focus-visible {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 2px;
}

.gbs-dash-kpi--internal {
    background: linear-gradient(145deg, #f0fdfa 0%, #ccfbf1 100%);
    border-color: rgba(13, 148, 136, 0.22);
}

.gbs-dash-kpi--internal .gbs-dash-kpi__icon {
    color: #0d9488;
}

.gbs-dash-kpi__svg {
    width: 1.35rem;
    height: 1.35rem;
    display: block;
}

.gbs-dash-kpi__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.gbs-dash-kpi__open {
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--gbs-brand, #4a7fb8);
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.gbs-dash-kpi--link:hover .gbs-dash-kpi__open {
    opacity: 1;
    transform: translateX(0);
}

.gbs-dash-kpi-section .gbs-dash-kpi__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 0.35rem;
}

.gbs-dash-shortcuts .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--worker .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--internal .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--companies .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--projects .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--internal-co .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--salary .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--eval .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--profile .gbs-dash-btn__icon,
.gbs-dash-shortcuts .gbs-dash-btn--pic .gbs-dash-btn__icon {
    color: var(--gbs-btn-grad-a, #5d82c1);
}

.gbs-dash-secondary {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
}

@media (min-width: 1200px) {
    .gbs-dash-secondary:has(.gbs-dash-alerts) {
        grid-template-columns: minmax(16rem, 20rem) minmax(0, 1fr);
        align-items: start;
    }

    .gbs-dash-secondary:has(.gbs-dash-alerts) .gbs-dash-analytics {
        grid-column: 1 / -1;
    }
}

.gbs-dash-alerts {
    padding: 0;
    border-radius: 1.5rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
    height: fit-content;
    position: sticky;
    top: 1rem;
    overflow: hidden;
}

.gbs-dash-alerts__head {
    margin-bottom: 0;
    padding: 1.25rem 1.35rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    background: #ffffff;
}

.gbs-dash-alerts .gbs-dash-alert-link {
    display: inline-flex;
    align-items: center;
    margin-top: 0.75rem;
    margin-bottom: 1.25rem;
    padding: 0.5rem 1rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #8e7e2c;
    text-decoration: none;
    border-radius: 999px;
    background: #ffffff;
    border: 2px solid #8e7e2c;
    transition: background 0.15s ease, color 0.15s ease;
}

.gbs-dash-alerts .gbs-dash-alert-link:hover {
    color: #ffffff;
    background: #8e7e2c;
    text-decoration: none;
}

.gbs-dash-alert-empty {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin: 0 1.25rem 1.25rem;
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    color: #334155;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.45;
}

.gbs-dash-alerts .gbs-dash-alert-grid,
.gbs-dash-alerts .gbs-dash-alert-empty,
.gbs-dash-alerts .gbs-dash-alert-link {
    margin-left: 1.25rem;
    margin-right: 1.25rem;
}

.gbs-dash-alerts .gbs-dash-alert-grid {
    margin-bottom: 0.5rem;
}

.gbs-dash-alert-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.gbs-dash-alert {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    padding: 0.75rem 0.875rem;
    border-radius: 0.75rem;
    border: 1px solid transparent;
}

.gbs-dash-alert--danger {
    background: #fef2f2;
    border-color: rgba(239, 68, 68, 0.2);
    color: #991b1b;
}

.gbs-dash-alert--warn {
    background: #fffbeb;
    border-color: rgba(245, 158, 11, 0.22);
    color: #92400e;
}

.gbs-dash-alert--info {
    background: #eff6ff;
    border-color: rgba(37, 99, 235, 0.18);
    color: #1e40af;
}

.gbs-dash-alert__icon {
    flex-shrink: 0;
    display: flex;
}

.gbs-dash-alert__svg {
    width: 1.125rem;
    height: 1.125rem;
}

.gbs-dash-alert__label {
    flex: 1;
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.35;
}

.gbs-dash-alert__count {
    font-size: 1.125rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
}

.gbs-dash-charts--compact .gbs-dash-chart-card {
    min-height: 20rem;
}

.gbs-dash-legend__link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    text-decoration: none;
    color: inherit;
    border-radius: inherit;
}

.gbs-dash-legend__link:hover {
    background: #f1f5f9;
}

.gbs-dash-legend__link:focus-visible {
    outline: 2px solid var(--gbs-brand);
    outline-offset: 1px;
}

/* Temp staff screen — segmented pill tabs (clear clickable buttons) */
.gbs-screen-tabs {
    margin: 0 0 1.25rem;
}

.gbs-screen-tabs__track {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding: 0.5rem;
    border-radius: 1rem;
    background: linear-gradient(160deg, rgba(237, 244, 250, 0.95) 0%, rgba(255, 255, 255, 0.98) 100%);
    border: 1px solid rgba(74, 127, 184, 0.22);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), var(--gbs-m3-elevation-1);
}

.gbs-screen-tabs__tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 2.5rem;
    padding: 0.5rem 1.15rem;
    border-radius: 0.75rem;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--gbs-ud-blue);
    text-decoration: none;
    cursor: pointer;
    background: #fff;
    border: 1px solid rgba(74, 127, 184, 0.38);
    box-shadow:
        0 1px 2px rgba(74, 127, 184, 0.1),
        0 2px 6px rgba(74, 127, 184, 0.08);
    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.15s ease;
}

.gbs-screen-tabs__tab:hover {
    color: #3d6a9e;
    background: #f0f7fc;
    border-color: var(--gbs-ud-blue);
    box-shadow:
        0 2px 4px rgba(74, 127, 184, 0.14),
        0 6px 14px rgba(74, 127, 184, 0.12);
    transform: translateY(-1px);
}

.gbs-screen-tabs__tab:focus-visible {
    outline: 2px solid var(--gbs-ud-blue-light);
    outline-offset: 2px;
}

.gbs-screen-tabs__tab.is-active {
    color: #fff;
    background: linear-gradient(145deg, var(--gbs-ud-blue) 0%, #3d6a9e 100%);
    border-color: transparent;
    box-shadow:
        0 2px 4px rgba(61, 106, 158, 0.35),
        0 8px 20px rgba(74, 127, 184, 0.28);
    transform: none;
}

.gbs-screen-tabs__tab.is-active:hover {
    color: #fff;
    background: linear-gradient(145deg, #3d6a9e 0%, var(--gbs-ud-blue) 100%);
    transform: none;
}

button.gbs-screen-tabs__tab {
    font: inherit;
    appearance: none;
    -webkit-appearance: none;
}

.gbs-gr-chart-panel[hidden] {
    display: none !important;
}

.gbs-apex-chart-host {
    min-height: 16rem;
}

.gbs-screen-tabs--internal .gbs-screen-tabs__track {
    gap: 0.4rem;
}

.gbs-screen-tabs--internal .gbs-screen-tabs__tab {
    min-width: 3.25rem;
}

/* Project / company list — jurisdiction & contract-entity filter panel */
.gbs-project-filter-tabs {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0 0 1.35rem;
    padding: 0.25rem;
    border-radius: 0.875rem;
    background: #fff;
    border: 1px solid rgba(93, 130, 193, 0.14);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 4px 16px rgba(93, 130, 193, 0.08);
    overflow: hidden;
}

.gbs-project-filter-tabs__row {
    display: grid;
    grid-template-columns: minmax(6.75rem, 8.5rem) minmax(0, 1fr);
    align-items: center;
    gap: 0.65rem 1rem;
    padding: 0.85rem 1rem;
}

.gbs-project-filter-tabs__row + .gbs-project-filter-tabs__row {
    border-top: 1px solid rgba(93, 130, 193, 0.1);
}

.gbs-project-filter-tabs__head {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

.gbs-project-filter-tabs__icon {
    flex-shrink: 0;
    width: 1.625rem;
    height: 1.625rem;
    border-radius: 0.5rem;
    background-color: var(--gbs-ud-blue);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}

.gbs-project-filter-tabs__icon--jurisdiction {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E") center / 68% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E") center / 68% no-repeat;
    background-color: #0e7490;
}

.gbs-project-filter-tabs__icon--contract {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 7V3H2v18h20V7H12zm-2 12H4v-2h6v2zm0-4H4v-2h6v2zm0-4H4V9h6v2zm10 8h-8v-2h8v2zm0-4h-8v-2h8v2zm0-4h-8V9h8v2z'/%3E%3C/svg%3E") center / 68% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 7V3H2v18h20V7H12zm-2 12H4v-2h6v2zm0-4H4v-2h6v2zm0-4H4V9h6v2zm10 8h-8v-2h8v2zm0-4h-8v-2h8v2zm0-4h-8V9h8v2z'/%3E%3C/svg%3E") center / 68% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-project-filter-tabs__label {
    margin: 0;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.3;
    color: #334155;
}

.gbs-project-filter-tabs__row--jurisdiction .gbs-screen-tabs,
.gbs-project-filter-tabs__row--contract .gbs-screen-tabs {
    margin: 0;
    min-width: 0;
}

.gbs-project-filter-tabs .gbs-screen-tabs__track {
    padding: 0.3rem;
    gap: 0.35rem;
    border-radius: 0.75rem;
    background: #f1f5f9;
    border: none;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.05);
}

.gbs-project-filter-tabs .gbs-screen-tabs__tab {
    min-height: 2rem;
    padding: 0.35rem 0.8rem;
    border-radius: 9999px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #475569;
    background: transparent;
    border: 1px solid transparent;
    box-shadow: none;
}

.gbs-project-filter-tabs .gbs-screen-tabs__tab:hover {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(93, 130, 193, 0.18);
    box-shadow: 0 1px 3px rgba(93, 130, 193, 0.1);
    transform: none;
}

.gbs-project-filter-tabs .gbs-screen-tabs__tab.is-active {
    color: #fff;
    border-color: transparent;
    transform: none;
}

.gbs-project-filter-tabs__row--jurisdiction .gbs-screen-tabs__tab.is-active {
    background: linear-gradient(145deg, #0e7490 0%, #0891b2 100%);
    box-shadow:
        0 1px 2px rgba(14, 116, 144, 0.35),
        0 4px 12px rgba(8, 145, 178, 0.28);
}

.gbs-project-filter-tabs__row--jurisdiction .gbs-screen-tabs__tab.is-active:hover {
    color: #fff;
    background: linear-gradient(145deg, #0891b2 0%, #0e7490 100%);
}

.gbs-project-filter-tabs__row--contract .gbs-screen-tabs__tab.is-active {
    background: linear-gradient(145deg, var(--gbs-ud-blue) 0%, #4a6f9e 100%);
    box-shadow:
        0 1px 2px rgba(93, 130, 193, 0.35),
        0 4px 12px rgba(93, 130, 193, 0.22);
}

.gbs-project-filter-tabs__row--contract .gbs-screen-tabs__tab.is-active:hover {
    color: #fff;
    background: linear-gradient(145deg, #4a6f9e 0%, var(--gbs-ud-blue) 100%);
}

.gbs-project-filter-tabs .gbs-screen-tabs__count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.25rem;
    margin-left: 0.3rem;
    padding: 0.05rem 0.35rem;
    border-radius: 9999px;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.02em;
    font-variant-numeric: tabular-nums;
    background: rgba(15, 23, 42, 0.08);
    color: inherit;
    opacity: 0.85;
}

.gbs-project-filter-tabs .gbs-screen-tabs__tab.is-active .gbs-screen-tabs__count {
    background: rgba(255, 255, 255, 0.22);
    opacity: 1;
}

.gbs-project-filter-tabs__row--contract .gbs-screen-tabs--internal .gbs-screen-tabs__tab {
    min-width: 2.75rem;
}

@media (max-width: 640px) {
    .gbs-project-filter-tabs__row {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
}

.gbs-shift-view-tabs .gbs-screen-tabs__track {
    gap: 0.35rem;
    padding: 0.35rem;
}

.gbs-shift-view-tabs .gbs-screen-tabs__tab {
    min-height: 2.1rem;
    padding: 0.35rem 0.85rem;
    font-size: 0.8125rem;
}

.gbs-shift-view-tabs .gbs-screen-tabs__tab--mode {
    font-size: 0.75rem;
    padding: 0.3rem 0.7rem;
    opacity: 0.92;
}

.gbs-shift-view-tabs .gbs-screen-tabs__tab--mode.is-active {
    opacity: 1;
}

.gbs-screen-tabs__divider {
    display: inline-block;
    width: 1px;
    height: 1.4rem;
    margin: 0 0.15rem;
    background: #cbd5e1;
    flex-shrink: 0;
    align-self: center;
}

.gbs-shift-view-tabs .gbs-screen-tabs__code {
    display: none;
}

.gbs-shift-mode-tabs {
    display: none;
}

.gbs-screen-tabs__code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    padding: 0.1rem 0.45rem;
    border-radius: 0.4rem;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    background: rgba(74, 127, 184, 0.12);
    color: inherit;
}

.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__code {
    background: rgba(255, 255, 255, 0.22);
    color: #fff;
}

.gbs-shift-mode-tabs .gbs-screen-tabs__code--beta {
    background: #ede9fe;
    color: #6d28d9;
}

.gbs-shift-mode-tabs .gbs-screen-tabs__tab.is-active .gbs-screen-tabs__code--beta {
    background: rgba(255, 255, 255, 0.28);
    color: #fff;
}

.gbs-screen-tabs__icon {
    width: 1.125rem;
    height: 1.125rem;
    border-radius: 0.35rem;
    background: rgba(74, 127, 184, 0.16);
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(74, 127, 184, 0.12);
}

.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon {
    background: rgba(255, 255, 255, 0.22);
}

.gbs-screen-tabs__icon--staff {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E") center / 70% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z'/%3E%3C/svg%3E") center / 70% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-screen-tabs__icon--sales {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 6h-2.18c.11-.31.18-.65.18-1 0-1.66-1.34-3-3-3-1.05 0-1.96.54-2.5 1.35l-.5.67-.5-.68C10.96 2.54 10.05 2 9 2 7.34 2 6 3.34 6 5c0 .35.07.69.18 1H4c-1.11 0-1.99.89-1.99 2L2 19c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V8c0-1.11-.89-2-2-2zm-5-2c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zM9 4c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm11 15H4V8h16v11z'/%3E%3C/svg%3E") center / 70% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M20 6h-2.18c.11-.31.18-.65.18-1 0-1.66-1.34-3-3-3-1.05 0-1.96.54-2.5 1.35l-.5.67-.5-.68C10.96 2.54 10.05 2 9 2 7.34 2 6 3.34 6 5c0 .35.07.69.18 1H4c-1.11 0-1.99.89-1.99 2L2 19c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V8c0-1.11-.89-2-2-2zm-5-2c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zM9 4c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm11 15H4V8h16v11z'/%3E%3C/svg%3E") center / 70% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-screen-tabs__icon--gr {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E") center / 70% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z'/%3E%3C/svg%3E") center / 70% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-screen-tabs__icon--ss {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 1 3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 10.99h7c-.53 4.12-3.28 7.79-7 8.94V12H5V6.3l7-3.11v8.8z'/%3E%3C/svg%3E") center / 70% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 1 3 5v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12V5l-9-4zm0 10.99h7c-.53 4.12-3.28 7.79-7 8.94V12H5V6.3l7-3.11v8.8z'/%3E%3C/svg%3E") center / 70% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-screen-tabs__icon--jurisdiction {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E") center / 70% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z'/%3E%3C/svg%3E") center / 70% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-screen-tabs__icon--factory {
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M22 21V7L12 2 2 7v14h4v-8h12v8h4zm-6 0h-4v-4h4v4z'/%3E%3C/svg%3E") center / 70% no-repeat;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M22 21V7L12 2 2 7v14h4v-8h12v8h4zm-6 0h-4v-4h4v4z'/%3E%3C/svg%3E") center / 70% no-repeat;
    background-color: var(--gbs-ud-blue);
}

.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon--staff,
.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon--sales,
.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon--gr,
.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon--ss,
.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon--jurisdiction,
.gbs-screen-tabs__tab.is-active .gbs-screen-tabs__icon--factory {
    background-color: #fff;
}

/* Owner name list screen */
.gbs-owner-screen__header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.25rem;
}

.gbs-owner-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 0.75rem;
    margin: 1.25rem 0 1rem;
}

.gbs-owner-stats__card {
    padding: 1rem 1.15rem;
    border-radius: 0.85rem;
    background: linear-gradient(145deg, rgba(139, 180, 220, 0.22) 0%, rgba(255, 255, 255, 0.92) 100%);
    border: 1px solid rgba(74, 127, 184, 0.22);
    box-shadow: var(--gbs-m3-elevation-1);
}

.gbs-owner-stats__value {
    display: block;
    font-size: 1.5rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--gbs-ud-blue);
    line-height: 1.2;
}

.gbs-owner-stats__label {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-owner-toolbar {
    margin-bottom: 1rem;
}

.gbs-owner-search {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    max-width: 22rem;
    padding: 0.35rem 0.85rem;
    border-radius: 0.75rem;
    border: 1px solid rgba(74, 127, 184, 0.25);
    background: #fff;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.gbs-owner-search__icon {
    color: #94a3b8;
    font-size: 1rem;
    line-height: 1;
}

.gbs-owner-search__input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: transparent;
    font-size: 0.875rem;
    outline: none;
}

.gbs-owner-alert {
    margin: 0.75rem 0;
    padding: 0.75rem 1rem;
    border-radius: 0.75rem;
    font-size: 0.875rem;
}

.gbs-owner-alert--ok {
    background: rgba(139, 180, 220, 0.22);
    color: var(--gbs-ud-blue);
    border: 1px solid rgba(139, 180, 220, 0.5);
}

.gbs-owner-alert--err {
    background: rgba(74, 127, 184, 0.08);
    color: var(--gbs-ud-blue);
    border: 2px solid var(--gbs-ud-blue);
}

.gbs-owner-readonly {
    margin: 0.75rem 0;
    font-size: 0.875rem;
    color: #64748b;
}

.gbs-owner-edit-panel {
    margin: 1rem 0;
    padding: 1.15rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(74, 127, 184, 0.28);
    background: linear-gradient(160deg, rgba(139, 180, 220, 0.12) 0%, #fff 70%);
}

.gbs-owner-edit-panel__title {
    font-size: 0.875rem;
    font-weight: 700;
    color: #334155;
    margin-bottom: 0.75rem;
}

.gbs-owner-table-wrap {
    margin-top: 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid var(--gbs-table-border);
    overflow: hidden;
    background: #fff;
}

.gbs-owner-table {
    table-layout: fixed;
    width: 100%;
    min-width: 52rem;
}

.gbs-owner-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

.gbs-owner-table th:nth-child(1),
.gbs-owner-table td:nth-child(1) {
    width: 6.75rem;
    white-space: nowrap;
}

.gbs-owner-table__col-name,
.gbs-owner-table th.gbs-owner-table__col-name,
.gbs-owner-table td.gbs-owner-table__col-name {
    width: 26%;
    min-width: 16rem;
    white-space: normal;
    word-break: break-word;
    line-height: 1.45;
}

.gbs-owner-table__col-short-tag {
    width: 14%;
    min-width: 9rem;
}

.gbs-owner-table__col-aliases {
    width: auto;
    min-width: 12rem;
}

.gbs-owner-table__col-actions {
    width: 12rem;
    min-width: 12rem;
}

.gbs-owner-count-badge {
    display: inline-flex;
    min-width: 1.75rem;
    justify-content: center;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    color: #fff;
    background: var(--gbs-ud-blue);
    text-decoration: none;
}

.gbs-owner-count-badge:hover {
    background: #3d6a9e;
}

/* Company list — sales / GR / SS staff chips */
.gbs-co-staff-col {
    min-width: 11rem;
    max-width: 15rem;
}

.gbs-co-staff-cell {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
}

.gbs-co-staff-cell__empty {
    color: #94a3b8;
}

.gbs-co-staff-slot {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.375rem 0.5rem;
    align-items: center;
    padding: 0.35rem 0.5rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(148, 163, 184, 0.35);
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.gbs-co-staff-slot__role {
    grid-row: 1 / -1;
    align-self: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.75rem;
    padding: 0.15rem 0.4rem;
    border-radius: 0.3rem;
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    line-height: 1.2;
    white-space: nowrap;
}

.gbs-co-staff-slot__main {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
}

.gbs-co-staff-slot__name {
    flex: 1;
    min-width: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1e40af;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-co-staff-slot__name:hover {
    color: #1e3a8a;
    text-decoration: underline;
}

.gbs-co-staff-slot__name--plain {
    color: #334155;
}

.gbs-co-staff-slot__filter {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.625rem;
    height: 1.625rem;
    border-radius: 0.375rem;
    border: 1px solid rgba(74, 127, 184, 0.25);
    background: #fff;
    color: var(--gbs-ud-blue);
    text-decoration: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.gbs-co-staff-slot__filter:hover {
    background: #eff6ff;
    border-color: rgba(74, 127, 184, 0.45);
    color: #1e40af;
}

.gbs-co-staff-slot--main_sales .gbs-co-staff-slot__role {
    background: #d1fae5;
    color: #047857;
}

.gbs-co-staff-slot--sub_sales .gbs-co-staff-slot__role {
    background: #ecfdf5;
    color: #059669;
}

.gbs-co-staff-slot--main_gr .gbs-co-staff-slot__role {
    background: #ede9fe;
    color: #6d28d9;
}

.gbs-co-staff-slot--gr_follow .gbs-co-staff-slot__role {
    background: #f5f3ff;
    color: #7c3aed;
}

.gbs-co-staff-slot--ss_owner .gbs-co-staff-slot__role {
    background: #fef3c7;
    color: #b45309;
}

.gbs-co-jurisdiction-pill {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    padding: 0.25rem 0.625rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #0369a1;
    background: linear-gradient(180deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid rgba(14, 165, 233, 0.35);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-co-jurisdiction-pill:hover {
    background: #e0f2fe;
    border-color: rgba(14, 165, 233, 0.55);
    color: #075985;
}

.gbs-co-jurisdiction-pill--static {
    cursor: default;
}

.gbs-icon--xs {
    width: 14px;
    height: 14px;
}

/* —— Scroll to top (全ページ) —— */
.gbs-scroll-top {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    z-index: 35;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.75rem;
    height: 2.75rem;
    padding: 0;
    border: 1px solid rgba(74, 127, 184, 0.45);
    border-radius: 50%;
    background: linear-gradient(165deg, var(--gbs-ud-blue) 0%, #3d6a9e 100%);
    color: #fff;
    cursor: pointer;
    box-shadow: var(--gbs-m3-elevation-2);
    opacity: 0;
    transform: translateY(0.5rem) scale(0.92);
    pointer-events: none;
    transition:
        opacity 0.25s ease,
        transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.2s ease,
        background 0.2s ease;
}

.gbs-scroll-top--visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.gbs-scroll-top:hover {
    background: linear-gradient(165deg, #3d6a9e 0%, var(--gbs-ud-blue) 100%);
    box-shadow: 0 6px 20px rgba(74, 127, 184, 0.35);
}

.gbs-scroll-top:focus-visible {
    outline: 2px solid var(--gbs-ud-blue-light);
    outline-offset: 3px;
}

.gbs-scroll-top__icon {
    display: block;
}

@media (max-width: 639px) {
    .gbs-scroll-top {
        right: 1rem;
        bottom: 1rem;
        width: 2.5rem;
        height: 2.5rem;
    }

    .gbs-scroll-top__icon {
        width: 20px;
        height: 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gbs-scroll-top {
        transition: opacity 0.15s ease;
        transform: none;
    }

    .gbs-scroll-top--visible {
        transform: none;
    }
}

/* —— List action button icons —— */
.gbs-icon {
    flex-shrink: 0;
    display: block;
}

.gbs-icon--sm {
    width: 1rem;
    height: 1rem;
}

.gbs-icon--status {
    width: 1.05rem;
    height: 1.05rem;
}

.gbs-residence-status {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 9999px;
    border: 1px solid transparent;
}

.gbs-residence-status--valid {
    color: #047857;
    background: #d1fae5;
    border-color: #a7f3d0;
}

.gbs-residence-status--expired {
    color: #b91c1c;
    background: #fee2e2;
    border-color: #fecaca;
}

.gbs-residence-status--expiring {
    color: #c2410c;
    background: #ffedd5;
    border-color: #fed7aa;
}

.gbs-residence-status--review {
    color: #b45309;
    background: #fef3c7;
    border-color: #fde68a;
}

.gbs-residence-legend {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.gbs-residence-legend__title {
    margin: 0;
    font-size: 1.0625rem;
    font-weight: 800;
    line-height: 1.25;
    color: #0f172a;
}

.gbs-residence-legend__row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.gbs-list-btn {
    white-space: nowrap;
    text-decoration: none;
}

.gbs-list-btn span,
.gbs-list-action--text span {
    line-height: 1.2;
}

.gbs-list-action--text {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--gbs-ud-blue);
    text-decoration: none;
    transition: color 0.15s ease;
}

.gbs-list-action--text:hover {
    color: #3d6a9e;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.gbs-scroll-top .gbs-icon--chevron-up {
    width: 22px;
    height: 22px;
}

/* —— Project module — Japanese enterprise UI (管理画面) —— */
.gbs-jp-screen {
    background: #fff;
    border: 1px solid var(--gbs-table-border);
    border-radius: 4px;
    padding: 1rem 1.15rem 1.25rem;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

@media (min-width: 640px) {
    .gbs-jp-screen {
        padding: 1.15rem 1.35rem 1.5rem;
    }
}

/* 下線タブ */
.gbs-jp-tabs {
    margin: 0 0 1rem;
    border-bottom: 1px solid var(--gbs-table-border);
}

.gbs-jp-tabs__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.gbs-jp-tabs__item {
    margin: 0;
}

.gbs-jp-tabs__link {
    display: block;
    padding: 0.55rem 1rem 0.6rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #475569;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    margin-bottom: -1px;
    white-space: nowrap;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.gbs-jp-tabs__link:hover {
    color: var(--gbs-ud-blue);
    background: rgba(220, 234, 245, 0.45);
}

.gbs-jp-tabs__link:focus-visible {
    outline: 2px solid var(--gbs-ud-blue-light);
    outline-offset: -2px;
}

.gbs-jp-tabs__link.is-active {
    color: var(--gbs-ud-blue);
    border-bottom-color: var(--gbs-ud-blue);
    background: rgba(220, 234, 245, 0.35);
}

/* パンくず */
.gbs-jp-breadcrumb {
    margin-bottom: 0.75rem;
}

.gbs-jp-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem 0.35rem;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.75rem;
    color: #64748b;
}

.gbs-jp-breadcrumb__item + .gbs-jp-breadcrumb__item::before {
    content: '/';
    margin-right: 0.35rem;
    color: #94a3b8;
}

.gbs-jp-breadcrumb__link {
    color: var(--gbs-ud-blue);
    text-decoration: none;
    font-weight: 600;
}

.gbs-jp-breadcrumb__link:hover {
    text-decoration: underline;
}

.gbs-jp-breadcrumb__current {
    color: #334155;
    font-weight: 700;
}

/* ページ見出し */
.gbs-jp-page-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
    margin: 0.5rem 0 1rem;
    padding-left: 0;
}

.gbs-jp-page-head__title {
    margin: 0;
    font-size: 1.125rem;
    font-weight: 800;
    line-height: 1.35;
    color: #1e293b;
    letter-spacing: 0.02em;
}

.gbs-jp-page-head__note {
    margin: 0.3rem 0 0;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #64748b;
    letter-spacing: 0.03em;
}

.gbs-jp-page-head__actions {
    flex-shrink: 0;
}

/* 絞り込み情報バー */
.gbs-jp-info-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
    padding: 0.55rem 0.75rem;
    font-size: 0.8125rem;
    background: #f8fafc;
    border: 1px solid var(--gbs-table-border-cell);
    border-radius: 2px;
}

.gbs-jp-info-bar__tag {
    display: inline-flex;
    align-items: center;
    padding: 0.1rem 0.45rem;
    font-size: 0.625rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #fff;
    background: var(--gbs-ud-blue);
    border-radius: 2px;
}

.gbs-jp-info-bar__text {
    flex: 1;
    min-width: 0;
    color: #334155;
    font-weight: 600;
}

.gbs-jp-info-bar__action {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--gbs-ud-blue);
    text-decoration: none;
    white-space: nowrap;
}

.gbs-jp-info-bar__action:hover {
    text-decoration: underline;
}

/* 通知 */
.gbs-jp-flash {
    margin-bottom: 0.75rem;
    padding: 0.55rem 0.75rem;
    font-size: 0.8125rem;
    font-weight: 700;
    border-radius: 2px;
    border: 1px solid var(--gbs-table-border-cell);
}

.gbs-jp-flash--ok {
    background: #edf4fa;
    color: #1e4d8f;
}

.gbs-jp-flash--err {
    background: #fff;
    color: #1e4d8f;
    border: 2px solid var(--gbs-ud-blue);
}

/* 件数表示 */
.gbs-jp-list-bar {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin: 0 0 0.65rem;
    padding: 0.45rem 0.65rem;
    font-size: 0.8125rem;
    background: #f1f5f9;
    border: 1px solid var(--gbs-table-border-cell);
    border-radius: 2px;
}

@media (min-width: 640px) {
    .gbs-jp-list-bar {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.gbs-jp-list-bar__count {
    margin: 0;
    font-weight: 700;
    color: #334155;
    font-variant-numeric: tabular-nums;
}

.gbs-jp-list-bar__range {
    margin: 0;
    font-size: 0.75rem;
    color: #64748b;
    font-variant-numeric: tabular-nums;
}

/* 一覧パネル */
.gbs-jp-panel {
    margin-top: 0.25rem;
    border: 1px solid var(--gbs-table-border);
    border-radius: 2px;
    background: #fff;
}

.gbs-jp-panel__head {
    padding: 0.45rem 0.75rem;
    background: linear-gradient(180deg, #e8f0f7 0%, #dceaf5 100%);
    border-bottom: 1px solid var(--gbs-table-border);
}

.gbs-jp-panel__title {
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 800;
    color: #1e293b;
    letter-spacing: 0.06em;
}

.gbs-jp-panel__body {
    padding: 0.65rem 0.75rem 0.75rem;
}

.gbs-jp-panel__body > nav {
    margin-bottom: 0.5rem;
}

/* キーワード検索 */
.gbs-jp-search-panel {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-bottom: 0.65rem;
    padding: 0.55rem 0.65rem;
    background: #fafbfc;
    border: 1px solid var(--gbs-table-border-cell);
    border-radius: 2px;
}

@media (min-width: 768px) {
    .gbs-jp-search-panel {
        flex-direction: row;
        align-items: flex-end;
        justify-content: space-between;
    }
}

.gbs-jp-search-panel__field {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    min-width: 0;
    flex: 1;
    max-width: 22rem;
}

.gbs-jp-search-panel__label {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: #64748b;
}

.gbs-jp-search-panel__input {
    width: 100%;
    padding: 0.4rem 0.55rem;
    font-size: 0.8125rem;
    border: 1px solid var(--gbs-table-border-cell);
    border-radius: 2px;
    background: #fff;
}

.gbs-jp-search-panel__input:focus {
    outline: 2px solid var(--gbs-ud-blue-light);
    outline-offset: 0;
    border-color: var(--gbs-ud-blue);
}

.gbs-jp-search-panel__hint {
    margin: 0;
    font-size: 0.6875rem;
    font-weight: 600;
    color: #94a3b8;
}

/* 格子線テーブル（一覧） */
.gbs-project-table-wrap {
    border-radius: 2px;
    border: 1px solid var(--gbs-table-border);
    background: #fff;
}

.gbs-project-table-wrap:focus-visible {
    outline: 2px solid var(--gbs-ud-blue-light);
    outline-offset: 1px;
}

.gbs-project-table-wrap > table {
    font-size: 0.8125rem;
}

.gbs-project-table-wrap > table th,
.gbs-project-table-wrap > table td {
    padding: 0.4rem 0.55rem;
}

.gbs-project-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--gbs-table-head-bg);
    font-size: 0.75rem;
    letter-spacing: 0.02em;
}

.gbs-project-table-wrap--wide .gbs-project-table tbody td:first-child,
.gbs-project-table-wrap--wide .gbs-project-table thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 3;
    background: #fff;
}

.gbs-project-table-wrap--wide .gbs-project-table thead th:first-child {
    background: var(--gbs-table-head-bg);
    z-index: 4;
}

.gbs-jp-panel nav.flex {
    gap: 0.25rem;
}

.gbs-jp-panel nav.flex span,
.gbs-jp-panel nav.flex a {
    min-width: 1.85rem;
    padding: 0.25rem 0.45rem;
    border-radius: 2px !important;
    font-size: 0.75rem !important;
}

.gbs-jp-panel nav.flex span {
    background: var(--gbs-ud-blue) !important;
    color: #fff !important;
    border: 1px solid var(--gbs-ud-blue) !important;
}

.gbs-jp-panel nav.flex a {
    background: #fff !important;
    color: var(--gbs-ud-blue) !important;
    border: 1px solid var(--gbs-table-border-cell) !important;
}

.gbs-jp-panel nav.flex a:hover {
    background: #edf4fa !important;
}

/* 該当なし */
.gbs-jp-empty {
    padding: 2rem 1rem;
    text-align: center;
    background: #fafbfc;
    border: 1px dashed var(--gbs-table-border-cell);
    border-radius: 2px;
}

.gbs-jp-empty__title {
    margin: 0;
    font-size: 0.875rem;
    font-weight: 700;
    color: #475569;
}

.gbs-jp-empty__hint {
    margin: 0.35rem 0 0;
    font-size: 0.75rem;
    color: #94a3b8;
}

/* ステータス角タグ */
.gbs-jp-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.05rem 0.45rem;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.45;
    border-radius: 2px;
    border: 1px solid transparent;
    white-space: nowrap;
}

.gbs-jp-tag--ok {
    background: #edf4fa;
    color: #1e4d8f;
    border-color: rgba(74, 127, 184, 0.35);
}

.gbs-jp-tag--warn {
    background: #fffbeb;
    color: #92400e;
    border-color: rgba(245, 158, 11, 0.35);
}

.gbs-jp-tag--muted {
    background: #f1f5f9;
    color: #64748b;
    border-color: #cbd5e1;
}

.gbs-jp-tag--neutral {
    background: #fff;
    color: #475569;
    border-color: var(--gbs-table-border-cell);
}

/* 入力フォーム */
.gbs-form-screen {
    max-width: 42rem;
}

.gbs-form-screen form label {
    font-size: 0.6875rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: #64748b;
}

.gbs-form-screen .gbs-input {
    border-radius: 2px;
    border-color: var(--gbs-table-border-cell);
}

.gbs-form-screen .gbs-input:focus-visible,
.gbs-form-screen select:focus-visible,
.gbs-form-screen textarea:focus-visible {
    outline: 2px solid var(--gbs-ud-blue-light);
    outline-offset: 0;
    border-color: var(--gbs-ud-blue);
}

.gbs-jp-screen .gbs-btn-primary,
.gbs-jp-screen .gbs-btn-secondary {
    border-radius: 2px;
    min-height: 2.25rem;
    font-size: 0.8125rem;
    font-weight: 700;
}

/* —— Japanese mobile / calm SaaS (スマホ・ソフトUI) —— */
:root {
    --gbs-jp-soft-bg: #f3f6fa;
    --gbs-jp-soft-surface: #ffffff;
    --gbs-jp-soft-border: rgba(74, 127, 184, 0.14);
    --gbs-jp-soft-shadow: 0 2px 14px rgba(74, 127, 184, 0.08);
    --gbs-jp-soft-shadow-lg: 0 8px 28px rgba(74, 127, 184, 0.1);
    --gbs-jp-soft-radius: 14px;
    --gbs-jp-soft-radius-sm: 10px;
    --gbs-jp-touch: 2.75rem;
}

@media (max-width: 767px) {
    .gbs-main-column main.gbs-page-container:has(.gbs-jp-soft) {
        padding-top: 0.65rem;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
        background: linear-gradient(180deg, #eef3f9 0%, var(--gbs-jp-soft-bg) 32%, #f8fafc 100%);
    }

    .gbs-jp-soft.gbs-jp-screen {
        background: var(--gbs-jp-soft-surface);
        border: 1px solid var(--gbs-jp-soft-border);
        border-top: none;
        border-radius: var(--gbs-jp-soft-radius);
        padding: 0.85rem 0.9rem 1rem;
        box-shadow: var(--gbs-jp-soft-shadow);
    }

    /* 横スクロール・ソフトチップタブ */
    .gbs-jp-soft .gbs-jp-tabs {
        margin: 0 0 0.85rem;
        padding: 0.15rem 0;
        border-bottom: none;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .gbs-jp-soft .gbs-jp-tabs::-webkit-scrollbar {
        display: none;
    }

    .gbs-jp-soft .gbs-jp-tabs__list {
        flex-wrap: nowrap;
        gap: 0.4rem;
        padding: 0.15rem 0.1rem 0.35rem;
    }

    .gbs-jp-soft .gbs-jp-tabs__link {
        flex-shrink: 0;
        margin-bottom: 0;
        border-bottom: none;
        border-radius: 999px;
        padding: 0.5rem 0.95rem;
        font-size: 0.75rem;
        font-weight: 700;
        color: #5b6b80;
        background: rgba(255, 255, 255, 0.92);
        border: 1px solid var(--gbs-jp-soft-border);
        box-shadow: 0 1px 4px rgba(74, 127, 184, 0.06);
    }

    .gbs-jp-soft .gbs-jp-tabs__link.is-active {
        color: #fff;
        background: linear-gradient(145deg, var(--gbs-ud-blue) 0%, #5a8ec4 100%);
        border-color: transparent;
        box-shadow: 0 4px 14px rgba(74, 127, 184, 0.28);
    }

    .gbs-jp-soft .gbs-jp-breadcrumb {
        margin-bottom: 0.65rem;
        padding: 0.35rem 0.5rem;
        background: rgba(255, 255, 255, 0.65);
        border-radius: var(--gbs-jp-soft-radius-sm);
    }

    .gbs-jp-soft .gbs-jp-page-head {
        flex-direction: column;
        align-items: stretch;
        margin: 0.35rem 0 0.85rem;
        padding: 0.65rem 0.75rem;
        border-left: none;
        border-radius: var(--gbs-jp-soft-radius-sm);
        background: linear-gradient(135deg, rgba(237, 244, 250, 0.95) 0%, rgba(255, 255, 255, 0.98) 100%);
        box-shadow: inset 0 0 0 1px var(--gbs-jp-soft-border);
    }

    .gbs-jp-soft .gbs-jp-page-head__title {
        font-size: 1.05rem;
        font-weight: 800;
        letter-spacing: 0.01em;
    }

    .gbs-jp-soft .gbs-jp-page-head__note {
        font-size: 0.6875rem;
        color: #7c8da5;
    }

    .gbs-jp-soft .gbs-jp-page-head__actions {
        width: 100%;
    }

    .gbs-jp-soft .gbs-jp-page-head__actions .gbs-btn-primary,
    .gbs-jp-soft .gbs-jp-page-head__actions .gbs-btn-secondary {
        width: 100%;
        justify-content: center;
        min-height: var(--gbs-jp-touch);
        border-radius: var(--gbs-jp-soft-radius-sm);
        box-shadow: 0 2px 8px rgba(74, 127, 184, 0.18);
    }

    .gbs-jp-soft .gbs-jp-info-bar,
    .gbs-jp-soft .gbs-jp-flash,
    .gbs-jp-soft .gbs-jp-list-bar {
        border-radius: var(--gbs-jp-soft-radius-sm);
        border-left-width: 3px;
    }

    .gbs-jp-soft .gbs-jp-panel {
        border: none;
        border-radius: var(--gbs-jp-soft-radius-sm);
        box-shadow: var(--gbs-jp-soft-shadow);
        overflow: hidden;
    }

    .gbs-jp-soft .gbs-jp-panel__head {
        background: linear-gradient(180deg, #f5f9fd 0%, #ebf3fa 100%);
        border-bottom: 1px solid var(--gbs-jp-soft-border);
    }

    .gbs-jp-soft .gbs-jp-panel__body {
        padding: 0.75rem 0.65rem 0.85rem;
        background: #fff;
    }

    .gbs-jp-soft .gbs-jp-search-panel {
        border: none;
        border-radius: var(--gbs-jp-soft-radius-sm);
        background: #f7fafc;
        box-shadow: inset 0 0 0 1px var(--gbs-jp-soft-border);
        padding: 0.65rem 0.7rem;
    }

    .gbs-jp-soft .gbs-jp-search-panel__field {
        max-width: none;
    }

    .gbs-jp-soft .gbs-jp-search-panel__input {
        min-height: var(--gbs-jp-touch);
        padding: 0.55rem 0.75rem;
        font-size: 1rem;
        border-radius: var(--gbs-jp-soft-radius-sm);
        border-color: var(--gbs-jp-soft-border);
        background: #fff;
        box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
    }

    .gbs-jp-soft .gbs-jp-search-panel__hint {
        font-size: 0.6875rem;
        color: #8b9cb0;
        line-height: 1.45;
    }

    .gbs-jp-soft .gbs-project-table-wrap {
        border: none;
        border-radius: var(--gbs-jp-soft-radius-sm);
        box-shadow: inset 0 0 0 1px var(--gbs-jp-soft-border);
    }

    .gbs-jp-soft .gbs-project-table-wrap > table th,
    .gbs-jp-soft .gbs-project-table-wrap > table td {
        border-color: rgba(148, 163, 184, 0.28);
        padding: 0.5rem 0.6rem;
    }

    .gbs-jp-soft .gbs-jp-panel nav.flex {
        flex-wrap: wrap;
        gap: 0.35rem;
        justify-content: center;
    }

    .gbs-jp-soft .gbs-jp-panel nav.flex span,
    .gbs-jp-soft .gbs-jp-panel nav.flex a {
        min-width: var(--gbs-jp-touch) !important;
        min-height: var(--gbs-jp-touch) !important;
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        border-radius: var(--gbs-jp-soft-radius-sm) !important;
        font-size: 0.8125rem !important;
    }

    .gbs-jp-soft .gbs-jp-empty {
        border-radius: var(--gbs-jp-soft-radius-sm);
        border-style: solid;
        border-color: var(--gbs-jp-soft-border);
        background: linear-gradient(180deg, #fafcfe 0%, #f4f8fc 100%);
        padding: 1.75rem 1rem;
    }

    .gbs-jp-soft .gbs-jp-tag {
        border-radius: 6px;
        padding: 0.15rem 0.5rem;
    }

    .gbs-jp-soft.gbs-form-screen form .gbs-input,
    .gbs-jp-soft.gbs-form-screen form select,
    .gbs-jp-soft.gbs-form-screen form textarea {
        min-height: var(--gbs-jp-touch);
        border-radius: var(--gbs-jp-soft-radius-sm);
        border-color: var(--gbs-jp-soft-border);
        font-size: 1rem;
    }

    .gbs-jp-soft.gbs-form-screen form textarea {
        min-height: 6rem;
    }

    .gbs-jp-soft.gbs-form-screen .gbs-btn-primary,
    .gbs-jp-soft.gbs-form-screen .gbs-btn-secondary {
        width: 100%;
        min-height: var(--gbs-jp-touch);
        border-radius: var(--gbs-jp-soft-radius-sm);
        justify-content: center;
    }

    .gbs-jp-soft .gbs-list-btn,
    .gbs-jp-soft .gbs-list-action--text {
        min-height: 2rem;
        padding: 0.35rem 0.65rem;
        border-radius: 8px;
    }

    /* Person in charge — gentle mobile card */
    .gbs-jp-soft .gbs-card {
        border-radius: var(--gbs-jp-soft-radius-sm);
        border: 1px solid var(--gbs-jp-soft-border);
        box-shadow: none;
    }

    .gbs-jp-soft form.flex-col.sm\:flex-row {
        flex-direction: column;
    }

    .gbs-jp-soft form.flex-col.sm\:flex-row button[type="submit"] {
        width: 100%;
        min-height: var(--gbs-jp-touch);
        border-radius: var(--gbs-jp-soft-radius-sm);
    }
}

@media (min-width: 768px) {
    .gbs-jp-soft.gbs-jp-screen {
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    }
}

/* —— Japanese typography: text · buttons · menus (文字・ボタン・メニュー) —— */
html[lang="ja"] body.gbs-app-bg {
    font-family: var(--gbs-jp-font);
    line-height: var(--gbs-jp-leading);
    letter-spacing: var(--gbs-jp-tracking);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

html[lang="ja"] .gbs-jp-screen,
html[lang="ja"] .gbs-jp-soft {
    font-family: var(--gbs-jp-font);
    font-size: var(--gbs-jp-text-base);
    line-height: var(--gbs-jp-leading);
    letter-spacing: var(--gbs-jp-tracking);
    font-feature-settings: "kern" 1, "palt" 1;
}

/* 見出し — solid color for JP readability */
html[lang="ja"] .gbs-jp-page-head__title {
    background: none;
    -webkit-background-clip: unset;
    background-clip: unset;
    color: #1e293b;
    font-weight: 700;
    line-height: var(--gbs-jp-leading-heading);
    letter-spacing: var(--gbs-jp-tracking-tight);
}

html[lang="ja"] .gbs-jp-page-head__note,
html[lang="ja"] .gbs-jp-list-bar__range,
html[lang="ja"] .gbs-jp-search-panel__hint,
html[lang="ja"] .gbs-jp-breadcrumb__list {
    line-height: var(--gbs-jp-leading-tight);
    letter-spacing: var(--gbs-jp-tracking);
}

html[lang="ja"] .gbs-jp-panel__title,
html[lang="ja"] .gbs-jp-info-bar__tag,
html[lang="ja"] .gbs-jp-search-panel__label,
html[lang="ja"] .gbs-form-screen form label {
    font-family: var(--gbs-jp-font);
    letter-spacing: 0.06em;
    line-height: var(--gbs-jp-leading-tight);
}

html[lang="ja"] .gbs-jp-list-bar__count,
html[lang="ja"] .gbs-jp-info-bar__text {
    line-height: var(--gbs-jp-leading-tight);
}

html[lang="ja"] .gbs-project-table-wrap > table {
    font-size: var(--gbs-jp-text-sm);
    line-height: var(--gbs-jp-leading-tight);
}

html[lang="ja"] .gbs-project-table thead th {
    font-size: var(--gbs-jp-text-xs);
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1.35;
}

html[lang="ja"] .gbs-project-table-wrap > table td {
    letter-spacing: var(--gbs-jp-tracking-tight);
}

/* ボタン — thumb-friendly, compact labels */
html[lang="ja"] .gbs-jp-screen .gbs-btn-primary,
html[lang="ja"] .gbs-jp-screen .gbs-btn-secondary,
html[lang="ja"] .gbs-jp-soft .gbs-btn-primary,
html[lang="ja"] .gbs-jp-soft .gbs-btn-secondary {
    font-family: var(--gbs-jp-font);
    font-size: var(--gbs-jp-text-sm);
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.45;
    min-height: var(--gbs-jp-btn-height-compact);
    padding: 0.5rem 1.1rem;
    border-radius: 6px;
}

html[lang="ja"] .gbs-jp-screen .gbs-list-btn,
html[lang="ja"] .gbs-jp-soft .gbs-list-btn {
    font-family: var(--gbs-jp-font);
    font-size: var(--gbs-jp-text-xs);
    font-weight: 600;
    letter-spacing: 0.03em;
    line-height: 1.4;
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
}

/* メニュー — compact sidebar (日本語) */
html[lang="ja"] .gbs-nav-link {
    font-family: var(--gbs-jp-font);
    padding: var(--gbs-jp-nav-pad-y) var(--gbs-jp-nav-pad-x);
    font-size: var(--gbs-jp-text-sm);
    font-weight: 600;
    line-height: var(--gbs-jp-leading-tight);
    letter-spacing: 0.035em;
    gap: 0.6rem;
}

html[lang="ja"] .gbs-nav-link--sub {
    padding: 0.55rem 0.85rem 0.55rem 1.85rem;
    font-size: var(--gbs-jp-text-xs);
    font-weight: 500;
    line-height: 1.45;
}

html[lang="ja"] .gbs-nav-sublist--nested .gbs-nav-link--sub {
    padding-left: 2.2rem;
}

html[lang="ja"] .gbs-nav-link--sub.is-active {
    font-weight: 600;
}

html[lang="ja"] .gbs-nav-subgroup-summary {
    font-family: var(--gbs-jp-font);
    padding: 0.55rem 0.85rem 0.55rem 1.45rem;
    font-size: var(--gbs-jp-text-xs);
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.035em;
    color: rgba(255, 255, 255, 0.95);
    text-shadow: 0 1px 2px rgba(26, 45, 70, 0.28);
}

html[lang="ja"] .gbs-nav-group-summary {
    font-family: var(--gbs-jp-font);
    font-size: var(--gbs-jp-text-label);
    letter-spacing: 0.08em;
    line-height: 1.4;
    padding: 0.6rem 0.85rem;
}

html[lang="ja"] .gbs-jp-tabs__link {
    font-family: var(--gbs-jp-font);
    font-size: var(--gbs-jp-text-xs);
    font-weight: 600;
    letter-spacing: 0.04em;
    line-height: 1.35;
}

html[lang="ja"] .gbs-topbar strong {
    font-family: var(--gbs-jp-font);
    letter-spacing: var(--gbs-jp-tracking-tight);
    line-height: 1.35;
}

html[lang="ja"] .gbs-input,
html[lang="ja"] .gbs-jp-search-panel__input,
html[lang="ja"] select.gbs-input,
html[lang="ja"] textarea.gbs-input {
    font-family: var(--gbs-jp-font);
    font-size: var(--gbs-jp-text-sm);
    line-height: var(--gbs-jp-leading-tight);
    letter-spacing: var(--gbs-jp-tracking-tight);
}

@media (max-width: 767px) {
    html[lang="ja"] .gbs-btn-primary,
    html[lang="ja"] .gbs-btn-secondary {
        min-height: var(--gbs-jp-btn-height);
        font-size: var(--gbs-jp-text-base);
    }

    html[lang="ja"] .gbs-jp-soft .gbs-list-btn,
    html[lang="ja"] .gbs-jp-soft .gbs-list-action--text {
        min-height: var(--gbs-jp-btn-height-compact);
        padding: 0.45rem 0.75rem;
        font-size: var(--gbs-jp-text-sm);
    }

    html[lang="ja"] .gbs-nav-link {
        min-height: var(--gbs-jp-btn-height);
        padding: 0.75rem 0.9rem;
    }

    html[lang="ja"] .gbs-jp-tabs__link {
        min-height: var(--gbs-jp-btn-height-compact);
        padding: 0.55rem 1rem;
        font-size: var(--gbs-jp-text-sm);
    }
}

@media (min-width: 768px) {
    html[lang="ja"] .gbs-jp-tabs__link {
        font-size: var(--gbs-jp-text-sm);
        padding: 0.5rem 0.95rem 0.55rem;
    }
}

/* —— UX pillars: trust · navigation · confirmation —— */
.gbs-jp-nav-context {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.35rem 0.5rem;
    margin: 0 0 0.55rem;
    padding: 0.35rem 0.55rem;
    font-size: var(--gbs-jp-text-xs, 0.75rem);
    line-height: 1.45;
    color: #64748b;
    background: rgba(248, 250, 252, 0.9);
    border-radius: 2px;
}

.gbs-jp-nav-context__label {
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #475569;
}

.gbs-jp-nav-context__where {
    font-weight: 600;
    color: #1e293b;
}

.gbs-jp-trust {
    margin: 0 0 0.75rem;
    padding: 0.65rem 0.75rem;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid rgba(148, 163, 184, 0.35);
    border-radius: 2px;
}

.gbs-jp-trust__title {
    margin: 0 0 0.25rem;
    font-size: var(--gbs-jp-text-xs, 0.75rem);
    font-weight: 800;
    letter-spacing: 0.06em;
    color: #475569;
}

.gbs-jp-trust__body {
    margin: 0;
    font-size: var(--gbs-jp-text-sm, 0.8125rem);
    line-height: 1.6;
    color: #334155;
}

.gbs-jp-save-guard {
    margin: 0 0 0.75rem;
    padding: 0.65rem 0.75rem;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 2px;
}

.gbs-jp-save-guard__check {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    cursor: pointer;
    font-size: var(--gbs-jp-text-sm, 0.8125rem);
    font-weight: 600;
    line-height: 1.5;
    color: #78350f;
}

.gbs-jp-save-guard__check input {
    margin-top: 0.2rem;
    width: 1.1rem;
    height: 1.1rem;
    flex-shrink: 0;
    accent-color: var(--gbs-ud-blue, #2563eb);
}

.gbs-jp-save-guard__hint {
    margin: 0.35rem 0 0 1.65rem;
    font-size: var(--gbs-jp-text-xs, 0.75rem);
    line-height: 1.45;
    color: #92400e;
}

.gbs-jp-save-guard + .gbs-btn-primary[disabled],
.gbs-jp-save-guard ~ .gbs-btn-primary[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

html[lang="ja"] .gbs-jp-trust__body,
html[lang="ja"] .gbs-jp-save-guard__check,
html[lang="ja"] .gbs-jp-save-guard__hint {
    font-family: var(--gbs-jp-font);
    letter-spacing: var(--gbs-jp-tracking-tight);
    line-height: var(--gbs-jp-leading-tight);
}

@media (max-width: 767px) {
    .gbs-jp-soft .gbs-jp-trust,
    .gbs-jp-soft .gbs-jp-nav-context,
    .gbs-jp-soft .gbs-jp-save-guard {
        border-radius: var(--gbs-jp-soft-radius-sm, 10px);
        margin-bottom: 0.65rem;
    }

    .gbs-jp-soft .gbs-jp-save-guard__check input {
        width: 1.25rem;
        height: 1.25rem;
        min-width: 1.25rem;
        min-height: 1.25rem;
    }

    .gbs-jp-soft .gbs-jp-tabs {
        scroll-snap-type: x proximity;
        overscroll-behavior-x: contain;
        touch-action: pan-x;
    }

    .gbs-jp-soft .gbs-jp-tabs__item {
        scroll-snap-align: center;
    }

    .gbs-jp-soft .gbs-project-table-wrap {
        overscroll-behavior-x: contain;
        touch-action: pan-x pan-y;
    }
}

/* —— Login: Japan calm SaaS (社内ログイン · SmartHR / freee style) —— */
body.gbs-login-body {
    --gbs-login-card-w: min(100%, 30rem);
    --gbs-login-btn-h: 3rem;
    --gbs-login-input-h: 3rem;
    --gbs-login-radius: 1.25rem;
    background: #eef2f7;
    background-image:
        radial-gradient(circle at 50% 0%, rgba(139, 180, 220, 0.18) 0%, transparent 52%),
        radial-gradient(circle at 100% 100%, rgba(74, 127, 184, 0.08) 0%, transparent 40%),
        linear-gradient(180deg, #eef2f7 0%, #f4f7fb 48%, #f8fafc 100%);
    animation: none;
}

body.gbs-login-body .gbs-orb {
    opacity: 0.28;
}

body.gbs-login-body .gbs-orb-a {
    width: 520px;
    height: 520px;
    top: -160px;
    right: -120px;
}

body.gbs-login-body .gbs-orb-b {
    width: 440px;
    height: 440px;
    bottom: -140px;
    left: -100px;
}

.gbs-login-page {
    position: relative;
    z-index: 10;
    width: var(--gbs-login-card-w);
    max-width: 100%;
    margin: 0 auto;
}

.gbs-login-page__footer {
    margin-top: 1.75rem;
    text-align: center;
}

.gbs-login-page__version {
    margin: 0.5rem 0 0;
    padding: 0;
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #94a3b8;
    text-align: center;
    background: none;
    border: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.gbs-login-page__tagline {
    margin: 0;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.22em;
    color: #94a3b8;
    text-transform: uppercase;
}

.gbs-jp-login {
    position: relative;
    width: 100%;
    padding: 2rem 1.85rem 2.15rem;
    background: #fff;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: var(--gbs-login-radius);
    box-shadow: none;
    overflow: hidden;
}

.gbs-jp-login::before {
    display: none;
}

.gbs-jp-login__head {
    margin-bottom: 1.5rem;
}

.gbs-jp-login__brand {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.gbs-jp-login__logo {
    height: 3rem;
    width: auto;
    max-width: 9.5rem;
    object-fit: contain;
    object-position: left center;
}

.gbs-jp-login__titles {
    min-width: 0;
    padding-top: 0.1rem;
}

.gbs-jp-login__title {
    margin: 0;
    font-size: 1.3125rem;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.02em;
    color: #356498;
}

.gbs-jp-login__subtitle {
    margin: 0.35rem 0 0;
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: 0.03em;
    color: #64748b;
}

.gbs-jp-login__lang {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(148, 163, 184, 0.16);
}

.gbs-jp-login__lang .gbs-lang-wrap {
    width: 100%;
}

.gbs-jp-login__lang .gbs-lang-select {
    flex: 1;
    min-width: 0;
    max-width: none;
    min-height: var(--gbs-login-btn-h);
    padding: 0.55rem 2.25rem 0.55rem 0.85rem;
    border-radius: 12px;
    font-size: 0.875rem;
    background-color: #fff;
    border-color: rgba(148, 163, 184, 0.42);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.gbs-jp-login__lang .gbs-lang-select:focus {
    outline: none;
    border-color: rgba(74, 127, 184, 0.55);
    box-shadow: 0 0 0 3px rgba(74, 127, 184, 0.14);
}

.gbs-jp-login__alert {
    margin-bottom: 1.1rem;
    padding: 0.75rem 0.9rem;
    border-radius: 12px;
    border: 1px solid rgba(248, 113, 113, 0.35);
    background: #fef2f2;
    color: #991b1b;
    font-size: 0.8125rem;
    line-height: 1.55;
}

.gbs-jp-login__google {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    min-height: var(--gbs-login-btn-h);
    padding: 0.7rem 1.15rem;
    border-radius: 999px;
    border: 1px solid rgba(148, 163, 184, 0.5);
    background: #fff;
    color: #334155;
    font-size: 0.9375rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.4;
    text-decoration: none;
    box-shadow: none;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.gbs-jp-login__google--disabled {
    background: #f8fafc;
    color: #94a3b8;
    cursor: not-allowed;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.gbs-jp-login__google-icon {
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
}

.gbs-jp-login__google-icon--muted {
    opacity: 0.65;
}

.gbs-jp-login__divider {
    margin: 1.35rem 0;
    font-size: 0.8125rem;
}

.gbs-jp-login__hint {
    margin: 0 0 1rem;
    font-size: 0.8125rem;
    line-height: 1.65;
    color: #64748b;
}

.gbs-jp-login__form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.gbs-jp-login__label {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #475569;
}

.gbs-jp-login__input {
    width: 100%;
    min-height: var(--gbs-login-input-h);
    padding: 0.65rem 1rem;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.45);
    background: #fff;
    font-size: 1rem;
    line-height: 1.45;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.gbs-jp-login__input:hover {
    border-color: rgba(100, 116, 139, 0.55);
}

.gbs-jp-login__input:focus {
    outline: none;
    border-color: rgba(74, 127, 184, 0.65);
    box-shadow: 0 0 0 4px rgba(74, 127, 184, 0.14);
    background: #fff;
}

.gbs-jp-login__submit {
    width: 100%;
    min-height: var(--gbs-login-btn-h);
    margin-top: 0.25rem;
    padding: 0.75rem 1.15rem;
    border-radius: 999px;
    font-size: 1rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    box-shadow: none;
    transition: transform 0.2s ease, background 0.2s ease;
}

.gbs-jp-login__submit:hover {
    transform: translateY(-1px);
    box-shadow: none;
}

.gbs-jp-login__submit:active {
    transform: translateY(0);
    box-shadow: none;
}

.gbs-jp-login__submit::before {
    display: none;
}

html[lang="ja"] body.gbs-login-body,
html[lang="ja"] .gbs-jp-login {
    font-family: var(--gbs-jp-font);
    letter-spacing: var(--gbs-jp-tracking-tight);
}

html[lang="ja"] .gbs-jp-login__title {
    font-weight: 700;
    line-height: var(--gbs-jp-leading-heading);
}

html[lang="ja"] .gbs-jp-login__subtitle,
html[lang="ja"] .gbs-jp-login__hint,
html[lang="ja"] .gbs-jp-login__label {
    line-height: var(--gbs-jp-leading-tight);
}

@media (min-width: 640px) {
    body.gbs-login-body {
        --gbs-login-card-w: 32rem;
    }

    .gbs-jp-login {
        padding: 2.35rem 2.15rem 2.4rem;
    }

    .gbs-jp-login__title {
        font-size: 1.375rem;
    }
}

@media (max-width: 639px) {
    body.gbs-login-body {
        --gbs-login-btn-h: 3.125rem;
        --gbs-login-input-h: 3.125rem;
    }

    .gbs-jp-login {
        padding: 1.75rem 1.5rem 1.9rem;
    }

    .gbs-jp-login__submit,
    .gbs-jp-login__google,
    .gbs-jp-login__input,
    .gbs-jp-login__lang .gbs-lang-select {
        min-height: var(--gbs-login-btn-h);
    }
}

/* —— Japan professional app shell (トップバー · パンくず) —— */
.gbs-jp-app {
    font-family: var(--gbs-jp-font, "Noto Sans JP", "Yu Gothic", sans-serif);
}

html[lang="ja"] .gbs-jp-app {
    line-height: var(--gbs-jp-leading);
    letter-spacing: var(--gbs-jp-tracking);
    font-feature-settings: "kern" 1, "palt" 1;
}

.gbs-jp-topbar__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.55rem 0.75rem;
    padding-top: 0.7rem;
    padding-bottom: 0.7rem;
}

.gbs-jp-topbar__menu {
    flex-shrink: 0;
}

.gbs-jp-topbar__menu-icon {
    width: 1.35rem;
    height: 1.35rem;
    pointer-events: none;
}

.gbs-jp-topbar__title-block {
    flex: 1 1 auto;
    min-width: 0;
}

.gbs-jp-topbar__title {
    min-width: 0;
}

.gbs-jp-topbar__title--mobile {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.gbs-jp-topbar__title--desktop {
    display: none;
}

.gbs-jp-topbar__logo {
    height: 1.75rem;
    width: auto;
    max-width: 6rem;
    object-fit: contain;
    flex-shrink: 0;
}

.gbs-jp-topbar__kicker {
    display: block;
    font-size: 0.625rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gbs-ud-blue);
    line-height: 1.3;
}

.gbs-jp-topbar__page {
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.35;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-jp-topbar__title--desktop .gbs-jp-topbar__page {
    font-size: 1.0625rem;
}

.gbs-jp-topbar__badge {
    display: none;
}

.gbs-jp-topbar__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem 0.55rem;
    margin-left: auto;
    min-width: 0;
}

.gbs-jp-topbar__user {
    font-size: 0.75rem;
    font-weight: 500;
    color: #475569;
    max-width: 11rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-jp-topbar__user-sep {
    color: #cbd5e1;
}

.gbs-jp-topbar__role {
    color: var(--gbs-ud-blue);
    font-weight: 600;
}

.gbs-jp-logout-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.45rem 0.95rem;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: #fff;
    text-decoration: none;
    background: linear-gradient(180deg, #475569 0%, #1e293b 100%);
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.18);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.gbs-jp-logout-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.22);
}

.gbs-jp-main {
    flex: 1;
    padding-top: 1.15rem;
    padding-bottom: 1.35rem;
}

.gbs-jp-app-crumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.45rem;
    margin: 0 0 1rem;
    font-size: 0.75rem;
    line-height: 1.45;
}

.gbs-jp-app-crumb__link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--gbs-ud-blue);
    font-weight: 600;
    text-decoration: none;
}

.gbs-jp-app-crumb__link:hover {
    color: var(--gbs-ud-blue-light);
}

.gbs-jp-app-crumb__icon {
    width: 0.85rem;
    height: 0.85rem;
    opacity: 0.85;
}

.gbs-jp-app-crumb__sep {
    color: #cbd5e1;
}

.gbs-jp-app-crumb__current {
    color: #334155;
    font-weight: 600;
}

.gbs-jp-main__alert {
    margin-bottom: 1rem;
}

.gbs-jp-main__alert-text {
    margin: 0;
    line-height: 1.5;
}

.gbs-sidebar-error {
    padding: 0.5rem 0.75rem;
    font-size: 0.75rem;
    line-height: 1.45;
    color: #991b1b;
    background: rgba(254, 226, 226, 0.95);
    border-bottom: 1px solid rgba(248, 113, 113, 0.35);
}

.gbs-sidebar-error p {
    margin: 0;
}

html[lang="ja"] .gbs-jp-topbar__page,
html[lang="ja"] .gbs-jp-topbar__user,
html[lang="ja"] .gbs-jp-app-crumb,
html[lang="ja"] .gbs-jp-logout-btn {
    font-family: var(--gbs-jp-font);
}

@media (min-width: 768px) {
    .gbs-jp-topbar__badge {
        display: inline-flex;
    }

    .gbs-jp-topbar__user {
        max-width: 14rem;
    }
}

@media (min-width: 1024px) {
    .gbs-jp-topbar__title--mobile {
        display: none;
    }

    .gbs-jp-topbar__title--desktop {
        display: block;
    }

    .gbs-jp-topbar__title-block {
        flex: 0 1 auto;
    }
}

@media (max-width: 767px) {
    .gbs-jp-topbar__actions {
        width: 100%;
        justify-content: flex-end;
    }

    .gbs-jp-logout-btn {
        min-height: var(--gbs-jp-btn-height, 2.75rem);
        padding-left: 1.1rem;
        padding-right: 1.1rem;
    }
}

/* Login refinements — reference match */
.gbs-jp-login__lang .gbs-lang-wrap {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.gbs-jp-login__lang .gbs-lang-label {
    flex-shrink: 0;
    min-width: 2.5rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
}

.gbs-jp-login__submit {
    border: none;
    color: #fff;
    background: linear-gradient(180deg, #6a9ecf 0%, var(--gbs-ud-blue) 48%, #3d6a9a 100%);
}

.gbs-jp-login__submit:hover {
    background: linear-gradient(180deg, #7aafe0 0%, #5589be 48%, #4576a8 100%);
}

.gbs-jp-login__google:hover {
    transform: none;
    border-color: rgba(100, 116, 139, 0.62);
    background: #fafbfc;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.07);
}

.gbs-btn-google.gbs-jp-login__google:hover {
    transform: none;
}

/* —— Loading: Care Earth logo orbit spinner —— */
@keyframes gbs-ce-orbit {
    to { transform: rotate(360deg); }
}

@keyframes gbs-ce-contrail {
    0%, 100% { opacity: 0.25; transform: rotate(0deg); }
    50% { opacity: 0.7; transform: rotate(180deg); }
}

@keyframes gbs-ce-glide {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-1px); }
}

.gbs-spinner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.gbs-spinner--ce {
    width: auto;
    height: auto;
}

.gbs-spinner__orbit {
    position: relative;
    display: block;
    width: 2rem;
    height: 2rem;
}

.gbs-spinner--sm .gbs-spinner__orbit {
    width: 1.65rem;
    height: 1.65rem;
}

.gbs-spinner--lg .gbs-spinner__orbit {
    width: 2.85rem;
    height: 2.85rem;
}

.gbs-spinner__track {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1.5px dashed rgba(74, 127, 184, 0.38);
    background: radial-gradient(circle at 50% 50%, rgba(139, 180, 220, 0.12) 0%, transparent 68%);
}

.gbs-spinner__mark-orbit {
    position: absolute;
    inset: 0;
    animation: gbs-ce-orbit 1.65s linear infinite;
}

.gbs-spinner__mark {
    position: absolute;
    top: -0.18rem;
    left: 50%;
    width: 46%;
    transform: translateX(-50%);
    filter: drop-shadow(0 2px 4px rgba(74, 127, 184, 0.35));
}

.gbs-spinner__logo-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
    animation: gbs-ce-glide 1.65s ease-in-out infinite;
}

.gbs-spinner__logo-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1;
    border-radius: 6px;
    font-size: 0.55rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    color: #fff;
    background: linear-gradient(135deg, var(--gbs-ud-blue-light), var(--gbs-ud-blue));
    animation: gbs-ce-glide 1.65s ease-in-out infinite;
}

.gbs-spinner__contrail {
    position: absolute;
    inset: 0.28rem;
    border-radius: 50%;
    border: 2px solid transparent;
    border-top-color: rgba(139, 180, 220, 0.55);
    border-right-color: rgba(74, 127, 184, 0.2);
    animation: gbs-ce-contrail 1.65s ease-in-out infinite;
    pointer-events: none;
}

.gbs-loading-overlay {
    position: fixed;
    inset: 0;
    z-index: 99990;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
    background:
        radial-gradient(ellipse 90% 60% at 50% 20%, rgba(186, 230, 253, 0.45), transparent 55%),
        rgba(248, 250, 252, 0.78);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s ease, visibility 0.22s ease;
}

.gbs-loading-overlay.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* Runner / stadium (pill) panel — sky capsule */
.gbs-loading-overlay__panel {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 0.8rem;
    padding: 0.55rem 1.3rem 0.55rem 0.75rem;
    border-radius: 9999px;
    min-height: 3rem;
    background: linear-gradient(180deg, #f0f9ff 0%, #fff 100%);
    border: 1px solid rgba(74, 127, 184, 0.32);
    box-shadow:
        0 12px 36px -10px rgba(74, 127, 184, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.95) inset;
}

.gbs-loading-overlay__panel.has-progress {
    flex-direction: column;
    align-items: stretch;
    gap: 0.65rem;
    min-width: min(20rem, calc(100vw - 3rem));
    max-width: 24rem;
    padding: 0.85rem 1rem 0.95rem;
    border-radius: 1rem;
}

.gbs-loading-overlay__main {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 0.8rem;
}

.gbs-loading-overlay__panel .gbs-spinner {
    flex-shrink: 0;
}

.gbs-loading-overlay__text {
    margin: 0;
    padding-right: 0.1rem;
    font-size: var(--gbs-jp-text-sm, 0.8125rem);
    font-weight: 600;
    letter-spacing: var(--gbs-jp-tracking, 0.04em);
    white-space: nowrap;
    color: var(--gbs-ud-blue);
}

.gbs-loading-overlay__progress {
    width: 100%;
    padding-top: 0.15rem;
    border-top: 1px solid rgba(74, 127, 184, 0.16);
}

.gbs-loading-overlay__progress.hidden {
    display: none;
}

.gbs-loading-overlay__progress-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.4rem;
}

.gbs-loading-overlay__progress-title {
    font-size: 0.74rem;
    font-weight: 700;
    color: #1e3a8a;
    letter-spacing: 0.01em;
}

.gbs-loading-overlay__progress-percent {
    font-size: 0.78rem;
    font-weight: 800;
    color: #1d4ed8;
}

.gbs-loading-overlay__progress-track {
    height: 0.52rem;
    border-radius: 9999px;
    background: rgba(148, 163, 184, 0.28);
    overflow: hidden;
}

.gbs-loading-overlay__progress-fill {
    display: block;
    height: 100%;
    width: 0%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2563eb 0%, #3b82f6 50%, #60a5fa 100%);
    box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.22) inset;
    transition: width 0.18s ease;
}

.gbs-loading-overlay__panel.is-indeterminate .gbs-loading-overlay__progress-fill {
    background: linear-gradient(
        90deg,
        #2563eb 0%,
        #38bdf8 35%,
        #60a5fa 50%,
        #38bdf8 65%,
        #2563eb 100%
    );
    background-size: 200% 100%;
    animation: gbs-sync-progress-indeterminate 1.35s ease-in-out infinite;
}

.gbs-loading-overlay__progress-detail {
    margin: 0.4rem 0 0;
    font-size: 0.72rem;
    color: #334155;
    line-height: 1.45;
    word-break: break-word;
}

/* Pill runner behind inline / cell spinners */
.gbs-spinner-runner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-width: 2.75rem;
    min-height: 1.75rem;
    padding: 0.18rem 0.55rem;
    border-radius: 9999px;
    background: linear-gradient(180deg, #f0f9ff 0%, #fff 100%);
    border: 1px solid rgba(74, 127, 184, 0.3);
    box-shadow: 0 2px 10px -2px rgba(74, 127, 184, 0.22);
}

body.gbs-is-loading {
    cursor: progress;
}

.gbs-cell-spinner {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    pointer-events: none;
}

.gbs-btn.is-loading {
    position: relative;
    pointer-events: none;
    color: transparent !important;
}

.gbs-btn.is-loading .gbs-icon,
.gbs-btn.is-loading > span:not(.gbs-btn-spinner) {
    visibility: hidden;
}

.gbs-btn-spinner {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

/* Airtable CSV sync — professional page shell */
.gbs-sync-shell {
    border: 1px solid rgba(148, 163, 184, 0.2);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 250, 252, 0.96) 100%);
}

.gbs-sync-hero {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.75rem 0.95rem;
    border-radius: 0.95rem;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.11) 0%, rgba(147, 197, 253, 0.05) 100%);
    border: 1px solid rgba(59, 130, 246, 0.2);
}

.gbs-sync-hero-icon {
    width: 2.15rem;
    height: 2.15rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    color: #1d4ed8;
    background: #dbeafe;
    border: 1px solid rgba(59, 130, 246, 0.28);
    flex: 0 0 auto;
}

.gbs-sync-alert {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.gbs-sync-alert::before {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.15rem;
    height: 1.15rem;
    border-radius: 999px;
    font-size: 0.76rem;
    flex: 0 0 auto;
}

.gbs-sync-alert--ok::before {
    content: "✓";
    color: #166534;
    background: #dcfce7;
}

.gbs-sync-alert--error::before {
    content: "!";
    color: #991b1b;
    background: #fee2e2;
}

.gbs-sync-panel {
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    box-shadow: 0 10px 24px -22px rgba(15, 23, 42, 0.55);
}

.gbs-sync-panel--result {
    border-color: rgba(59, 130, 246, 0.24) !important;
}

.gbs-sync-result-grid {
    margin-top: 0.9rem;
}

.gbs-sync-stat {
    border: 1px solid rgba(148, 163, 184, 0.18);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.65);
}

.gbs-sync-stat dt {
    margin-bottom: 0.08rem;
}

/* Airtable CSV sync — drag & drop upload */
.gbs-sync-csv-form {
    margin-top: 1rem;
    display: grid;
    gap: 0.95rem;
}

.gbs-sync-csv-file-label {
    display: block;
    margin-bottom: 0.42rem;
    font-size: 0.66rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 700;
    color: #64748b;
}

.gbs-sync-dropzone {
    position: relative;
    border: 2px dashed rgba(100, 116, 139, 0.45);
    border-radius: 0.95rem;
    background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.gbs-sync-dropzone--active {
    border-color: #2563eb;
    background: #eff6ff;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.12);
    transform: translateY(-1px);
}

.gbs-sync-dropzone--has-file {
    border-color: rgba(37, 99, 235, 0.45);
    background: linear-gradient(180deg, #f8fafc 0%, #f0f9ff 100%);
}

.gbs-sync-dropzone--disabled {
    opacity: 0.55;
    pointer-events: none;
}

.gbs-sync-dropzone-input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.gbs-sync-dropzone-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.48rem;
    min-height: 9.4rem;
    padding: 1.35rem 1rem;
    cursor: pointer;
    text-align: center;
}

.gbs-sync-dropzone-icon {
    width: 2.3rem;
    height: 2.3rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    line-height: 1;
    background: #e2e8f0;
    color: #1e3a8a;
}

.gbs-sync-dropzone-hint {
    font-size: 0.9rem;
    font-weight: 600;
    color: #334155;
    max-width: 28rem;
}

.gbs-sync-dropzone-file {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1d4ed8;
    word-break: break-all;
}

.gbs-sync-dropzone-browse {
    font-size: 0.75rem;
    color: #64748b;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.gbs-sync-dropzone-meta {
    margin-top: 0.45rem;
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.45;
}

.gbs-sync-file-limit {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin-top: 0.55rem;
    font-size: 0.74rem;
    font-weight: 600;
    color: #475569;
}

.gbs-sync-file-limit-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.1rem;
    padding: 0.12rem 0.42rem;
    border-radius: 0.35rem;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: #1e3a8a;
    background: #dbeafe;
    border: 1px solid rgba(59, 130, 246, 0.28);
}

.gbs-sync-dropzone-error {
    margin-top: 0.45rem;
    font-size: 0.75rem;
    color: #dc2626;
}

.gbs-sync-csv-actions {
    display: flex;
    gap: 0.9rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.gbs-sync-upload-progress {
    margin-top: 1rem;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.gbs-sync-upload-panel {
    padding: 1rem 1.1rem 1.05rem;
    border-radius: 1rem;
    border: 1px solid rgba(148, 163, 184, 0.28);
    background:
        radial-gradient(ellipse 120% 80% at 0% 0%, rgba(219, 234, 254, 0.55), transparent 55%),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 10px 28px -14px rgba(37, 99, 235, 0.22);
}

.gbs-sync-upload-progress--idle .gbs-sync-upload-panel {
    opacity: 0.72;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.gbs-sync-upload-progress--active .gbs-sync-upload-panel,
.gbs-sync-upload-progress--processing .gbs-sync-upload-panel {
    opacity: 1;
    transform: translateY(-1px);
    border-color: rgba(37, 99, 235, 0.34);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.9) inset,
        0 0 0 4px rgba(37, 99, 235, 0.08),
        0 16px 34px -18px rgba(37, 99, 235, 0.38);
}

.gbs-sync-upload-progress--processing .gbs-sync-upload-panel {
    border-color: rgba(14, 165, 233, 0.38);
    background:
        radial-gradient(ellipse 120% 80% at 100% 0%, rgba(186, 230, 253, 0.45), transparent 55%),
        linear-gradient(180deg, #f0f9ff 0%, #ffffff 100%);
}

.gbs-sync-upload-progress--error .gbs-sync-upload-panel {
    border-color: rgba(239, 68, 68, 0.34);
    background: linear-gradient(180deg, #fff5f5 0%, #ffffff 100%);
    box-shadow:
        0 0 0 4px rgba(239, 68, 68, 0.07),
        0 12px 28px -16px rgba(239, 68, 68, 0.28);
}

.gbs-sync-upload-status {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.gbs-sync-upload-status-ring {
    position: relative;
    flex-shrink: 0;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid rgba(59, 130, 246, 0.22);
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.85) inset;
}

.gbs-sync-upload-status-dot {
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 9999px;
    background: #94a3b8;
}

.gbs-sync-upload-progress--active .gbs-sync-upload-status-ring {
    background: linear-gradient(180deg, #dbeafe 0%, #bfdbfe 100%);
    animation: gbs-sync-ring-pulse 1.6s ease-in-out infinite;
}

.gbs-sync-upload-progress--active .gbs-sync-upload-status-dot {
    background: #2563eb;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.18);
}

.gbs-sync-upload-progress--processing .gbs-sync-upload-status-ring {
    background: conic-gradient(from 0deg, #38bdf8, #2563eb, #60a5fa, #38bdf8);
    animation: gbs-sync-ring-spin 1.1s linear infinite;
}

.gbs-sync-upload-progress--processing .gbs-sync-upload-status-dot {
    width: 0.72rem;
    height: 0.72rem;
    background: #ffffff;
}

.gbs-sync-upload-progress--error .gbs-sync-upload-status-dot {
    background: #ef4444;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.16);
}

.gbs-sync-upload-status-copy {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.12rem;
}

.gbs-sync-upload-title {
    font-size: 0.84rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: 0.01em;
    line-height: 1.25;
}

.gbs-sync-upload-subtitle {
    font-size: 0.74rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.35;
}

.gbs-sync-upload-progress--active .gbs-sync-upload-subtitle,
.gbs-sync-upload-progress--processing .gbs-sync-upload-subtitle {
    color: #2563eb;
}

.gbs-sync-upload-percent {
    flex-shrink: 0;
    min-width: 3.1rem;
    text-align: right;
    font-size: 1.05rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #1d4ed8;
    letter-spacing: -0.02em;
}

.gbs-sync-upload-progress--idle .gbs-sync-upload-percent {
    color: #64748b;
    font-size: 0.92rem;
}

.gbs-sync-upload-progress--processing .gbs-sync-upload-percent {
    color: #0284c7;
}

.gbs-sync-upload-progress--error .gbs-sync-upload-percent {
    color: #dc2626;
}

.gbs-sync-upload-track-wrap {
    margin-bottom: 0.65rem;
}

.gbs-sync-upload-track {
    position: relative;
    height: 0.72rem;
    border-radius: 9999px;
    background: rgba(148, 163, 184, 0.22);
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06) inset;
}

.gbs-sync-upload-fill {
    position: relative;
    z-index: 1;
    display: block;
    height: 100%;
    width: 0%;
    border-radius: inherit;
    background: linear-gradient(90deg, #1d4ed8 0%, #3b82f6 45%, #60a5fa 100%);
    box-shadow:
        0 0 12px rgba(59, 130, 246, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.25) inset;
    transition: width 0.22s ease;
}

.gbs-sync-upload-shine {
    position: absolute;
    inset: 0 auto 0 0;
    width: 45%;
    z-index: 2;
    pointer-events: none;
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.55) 50%,
        rgba(255, 255, 255, 0) 100%
    );
    transform: translateX(-120%);
    opacity: 0;
}

.gbs-sync-upload-progress--active .gbs-sync-upload-shine {
    opacity: 1;
    animation: gbs-sync-bar-shine 1.45s ease-in-out infinite;
}

.gbs-sync-upload-progress--processing .gbs-sync-upload-fill {
    width: 100% !important;
    background: linear-gradient(
        90deg,
        #2563eb 0%,
        #38bdf8 35%,
        #60a5fa 50%,
        #38bdf8 65%,
        #2563eb 100%
    );
    background-size: 200% 100%;
    animation: gbs-sync-progress-indeterminate 1.35s ease-in-out infinite;
}

.gbs-sync-upload-progress--error .gbs-sync-upload-fill {
    background: linear-gradient(90deg, #dc2626 0%, #f87171 100%);
    box-shadow: none;
}

.gbs-sync-upload-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.55rem;
    margin-bottom: 0.45rem;
}

.gbs-sync-upload-stat {
    padding: 0.42rem 0.55rem;
    border-radius: 0.62rem;
    font-size: 0.72rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: #334155;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(148, 163, 184, 0.22);
    text-align: center;
    line-height: 1.25;
}

.gbs-sync-upload-stat::before {
    display: block;
    margin-bottom: 0.12rem;
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-sync-upload-stat[data-gbs-upload-stat-size]::before {
    content: 'Transferred';
}

.gbs-sync-upload-stat[data-gbs-upload-stat-speed]::before {
    content: 'Speed';
}

.gbs-sync-upload-stat[data-gbs-upload-stat-eta]::before {
    content: 'ETA';
}

.gbs-sync-server-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0.65rem 0 0.45rem;
    padding: 0.65rem;
    border-radius: 0.85rem;
    background: linear-gradient(135deg, rgba(239, 246, 255, 0.95) 0%, rgba(248, 250, 252, 0.98) 100%);
    border: 1px solid rgba(59, 130, 246, 0.18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.gbs-sync-server-stat {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
    padding: 0.45rem 0.5rem;
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.gbs-sync-server-stat-label {
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-sync-server-stat-value {
    font-size: 0.82rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
    line-height: 1.25;
    word-break: break-word;
}

.gbs-sync-upload-progress--processing .gbs-sync-server-stat-value {
    color: #1d4ed8;
}

@media (max-width: 768px) {
    .gbs-sync-server-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.gbs-sync-upload-detail {
    margin: 0;
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    line-height: 1.45;
}

.gbs-sync-upload-progress--error .gbs-sync-upload-detail {
    color: #b91c1c;
}

.gbs-sync-upload-progress--done .gbs-sync-upload-panel {
    border-color: rgba(22, 163, 74, 0.34);
    background:
        radial-gradient(ellipse 120% 80% at 0% 0%, rgba(220, 252, 231, 0.55), transparent 55%),
        linear-gradient(180deg, #ffffff 0%, #f0fdf4 100%);
    box-shadow:
        0 0 0 4px rgba(22, 163, 74, 0.08),
        0 16px 34px -18px rgba(22, 163, 74, 0.28);
}

.gbs-sync-upload-progress--done .gbs-sync-upload-percent {
    color: #15803d;
}

.gbs-sync-upload-progress--done .gbs-sync-upload-fill {
    background: linear-gradient(90deg, #15803d 0%, #22c55e 50%, #4ade80 100%);
}

.gbs-sync-upload-progress--done .gbs-sync-upload-status-dot {
    background: #16a34a;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, 0.16);
}

.gbs-sync-activity {
    margin-top: 0.85rem;
    padding-top: 0.85rem;
    border-top: 1px solid rgba(148, 163, 184, 0.22);
}

.gbs-sync-activity-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.55rem;
}

.gbs-sync-activity-title {
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #475569;
}

.gbs-sync-activity-count {
    font-size: 0.68rem;
    font-weight: 700;
    color: #64748b;
    padding: 0.14rem 0.45rem;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid rgba(148, 163, 184, 0.24);
}

.gbs-sync-activity-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 14rem;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 0.42rem;
}

.gbs-sync-activity-item {
    display: grid;
    grid-template-columns: 1.1rem 1fr;
    gap: 0.62rem;
    align-items: start;
    position: relative;
}

.gbs-sync-activity-item:not(:last-child)::after {
    content: '';
    position: absolute;
    left: 0.52rem;
    top: 1.15rem;
    bottom: -0.42rem;
    width: 2px;
    background: linear-gradient(180deg, rgba(148, 163, 184, 0.35), rgba(148, 163, 184, 0.08));
}

.gbs-sync-activity-marker {
    width: 1.05rem;
    height: 1.05rem;
    margin-top: 0.08rem;
    border-radius: 9999px;
    border: 2px solid #cbd5e1;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.95);
}

.gbs-sync-activity-item--active .gbs-sync-activity-marker {
    border-color: #2563eb;
    background: #dbeafe;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
    animation: gbs-sync-ring-pulse 1.6s ease-in-out infinite;
}

.gbs-sync-activity-item--done .gbs-sync-activity-marker {
    border-color: #16a34a;
    background: #dcfce7;
}

.gbs-sync-activity-item--done .gbs-sync-activity-marker::after {
    content: '';
    display: block;
    width: 0.34rem;
    height: 0.58rem;
    margin: 0.12rem auto 0;
    border-right: 2px solid #15803d;
    border-bottom: 2px solid #15803d;
    transform: rotate(45deg);
}

.gbs-sync-activity-item--error .gbs-sync-activity-marker {
    border-color: #ef4444;
    background: #fee2e2;
}

.gbs-sync-activity-body {
    padding: 0.48rem 0.62rem;
    border-radius: 0.68rem;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.gbs-sync-activity-item--active .gbs-sync-activity-body {
    border-color: rgba(37, 99, 235, 0.22);
    background: linear-gradient(180deg, #eff6ff 0%, #ffffff 100%);
}

.gbs-sync-activity-item--done .gbs-sync-activity-body {
    border-color: rgba(22, 163, 74, 0.18);
}

.gbs-sync-activity-item--error .gbs-sync-activity-body {
    border-color: rgba(239, 68, 68, 0.22);
    background: linear-gradient(180deg, #fef2f2 0%, #ffffff 100%);
}

.gbs-sync-activity-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.gbs-sync-activity-label {
    font-size: 0.76rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.35;
}

.gbs-sync-activity-time {
    flex-shrink: 0;
    font-size: 0.66rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: #64748b;
}

.gbs-sync-activity-detail {
    margin: 0.28rem 0 0;
    font-size: 0.71rem;
    font-weight: 600;
    color: #475569;
    line-height: 1.4;
    word-break: break-word;
}

.gbs-sync-result-inline {
    margin-top: 0.85rem;
    padding: 0.85rem 0.9rem;
    border-radius: 0.85rem;
    border: 1px solid rgba(22, 163, 74, 0.22);
    background: linear-gradient(180deg, #f0fdf4 0%, #ffffff 100%);
}

.gbs-sync-result-inline-head {
    margin-bottom: 0.55rem;
}

.gbs-sync-result-inline-title {
    font-size: 0.78rem;
    font-weight: 800;
    color: #14532d;
    letter-spacing: 0.02em;
}

.gbs-sync-result-inline-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    margin: 0;
}

.gbs-sync-result-inline-stat {
    padding: 0.55rem 0.65rem;
    border-radius: 0.65rem;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.gbs-sync-result-inline-stat dt {
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #64748b;
}

.gbs-sync-result-inline-stat dd {
    margin: 0.18rem 0 0;
    font-size: 1rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: #0f172a;
}

.gbs-sync-result-inline-stat--insert {
    border-color: rgba(22, 163, 74, 0.18);
    background: #f0fdf4;
}

.gbs-sync-result-inline-stat--insert dd {
    color: #15803d;
}

.gbs-sync-result-inline-stat--update {
    border-color: rgba(37, 99, 235, 0.18);
    background: #eff6ff;
}

.gbs-sync-result-inline-stat--update dd {
    color: #1d4ed8;
}

.gbs-sync-result-inline-stat--skip {
    border-color: rgba(217, 119, 6, 0.18);
    background: #fffbeb;
}

.gbs-sync-result-inline-stat--skip dd {
    color: #b45309;
}

@keyframes gbs-sync-ring-pulse {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.16);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(37, 99, 235, 0);
    }
}

@keyframes gbs-sync-ring-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes gbs-sync-bar-shine {
    0% {
        transform: translateX(-120%);
    }
    100% {
        transform: translateX(320%);
    }
}

@keyframes gbs-sync-progress-indeterminate {
    0% {
        background-position: 100% 0;
    }
    100% {
        background-position: -100% 0;
    }
}

@media (max-width: 640px) {
    .gbs-sync-upload-stats {
        grid-template-columns: 1fr;
    }

    .gbs-sync-result-inline-grid {
        grid-template-columns: 1fr;
    }

    .gbs-sync-csv-actions {
        align-items: stretch;
    }

    .gbs-sync-csv-actions .gbs-btn {
        width: 100%;
    }
}

/* List column picker (companies / projects / dispatch staff) */
.gbs-col-picker-open {
    flex-shrink: 0;
}

body.gbs-col-picker-open {
    position: fixed;
    width: 100%;
    overflow: hidden;
}

.gbs-col-picker-modal {
    position: fixed;
    inset: 0;
    z-index: 70;
    display: none;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.gbs-col-picker-modal.is-open {
    display: flex;
}

.gbs-col-picker-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
}

.gbs-col-picker-panel {
    position: relative;
    width: min(92vw, 520px);
    max-height: 86vh;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 24px 50px rgba(2, 6, 23, 0.25);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.gbs-col-picker-head {
    padding: 12px 16px;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fafc;
}

.gbs-col-picker-search-wrap {
    padding: 12px 16px;
    border-bottom: 1px solid #e2e8f0;
}

.gbs-col-picker-search {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 13px;
}

.gbs-col-picker-list {
    padding: 10px 16px;
    overflow-y: auto;
    max-height: min(56vh, 440px);
}

.gbs-col-picker-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 6px;
    border-radius: 6px;
    font-size: 14px;
    color: #334155;
    border: 1px solid transparent;
}

.gbs-col-picker-item:hover {
    background: #f8fafc;
}

.gbs-col-picker-item.is-dragging {
    opacity: 0.45;
}

.gbs-col-picker-item.is-drag-over {
    border-color: #93c5fd;
    background: #eff6ff;
}

.gbs-col-picker-drag {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #94a3b8;
    cursor: grab;
    font-size: 12px;
    line-height: 1;
    padding: 0;
    touch-action: none;
}

.gbs-col-picker-drag:active {
    cursor: grabbing;
}

.gbs-col-picker-drag:hover {
    color: #475569;
    background: #e2e8f0;
}

.gbs-col-picker-item-label {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 1;
    min-width: 0;
    cursor: pointer;
}

.gbs-col-picker-drag-hint {
    padding: 0 16px 8px;
    margin: 0;
    font-size: 11px;
    color: #64748b;
}

.gbs-col-picker-foot {
    padding: 12px 16px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    background: #f8fafc;
}

.gbs-list-col-picker-bar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.gbs-sales-performance-screen {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.gbs-sales-month-picker {
    position: relative;
}

.gbs-sales-month-picker__field {
    position: relative;
}

.gbs-sales-month-picker__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    width: 11.5rem;
    padding: 0.5rem 0.65rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    background: #fff;
    font-size: 0.875rem;
    color: #1e293b;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.gbs-sales-month-picker__trigger:hover,
.gbs-sales-month-picker__trigger:focus-visible {
    border-color: var(--gbs-ud-blue);
    box-shadow: 0 0 0 3px rgba(93, 130, 193, 0.18);
    outline: none;
}

.gbs-sales-month-picker__display {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-sales-month-picker__icon {
    display: inline-flex;
    flex-shrink: 0;
    width: 1.125rem;
    height: 1.125rem;
    color: var(--gbs-ud-blue);
}

.gbs-sales-month-picker__icon svg {
    width: 100%;
    height: 100%;
}

.gbs-sales-month-picker__panel {
    position: absolute;
    z-index: 50;
    left: 0;
    top: calc(100% + 0.35rem);
    width: 15.5rem;
    border-radius: 0.65rem;
    border: 1px solid var(--gbs-table-border);
    background: #fff;
    box-shadow: 0 10px 24px -8px rgba(15, 23, 42, 0.16);
    overflow: hidden;
}

.gbs-sales-month-picker__panel-head {
    display: grid;
    grid-template-columns: 2.25rem 1fr 2.25rem;
    align-items: center;
    gap: 0.25rem;
    padding: 0.5rem 0.55rem;
    background: var(--gbs-table-head-bg);
    color: var(--gbs-table-head-color);
    border-bottom: 1px solid var(--gbs-table-border);
}

.gbs-sales-month-picker__head-side {
    display: flex;
    align-items: center;
}

.gbs-sales-month-picker__head-side--left {
    justify-content: flex-start;
}

.gbs-sales-month-picker__head-side--right {
    justify-content: flex-end;
}

.gbs-sales-month-picker__year-center {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    justify-self: center;
}

.gbs-sales-month-picker__year {
    text-align: center;
    font-size: 0.9375rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.gbs-sales-month-picker__year-step {
    display: inline-flex;
    flex-direction: column;
    gap: 0.05rem;
}

.gbs-sales-month-picker__year-btn,
.gbs-sales-month-picker__year-next {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--gbs-ud-blue);
    cursor: pointer;
    line-height: 1;
}

.gbs-sales-month-picker__year-btn {
    width: 1rem;
    height: 0.65rem;
    font-size: 0.55rem;
    opacity: 0.85;
}

.gbs-sales-month-picker__year-btn--solo {
    width: 1.25rem;
    height: 1.25rem;
    font-size: 0.65rem;
}

.gbs-sales-month-picker__year-btn:hover,
.gbs-sales-month-picker__year-next:hover {
    opacity: 1;
    color: var(--gbs-ud-blue);
}

.gbs-sales-month-picker__year-next {
    width: 1.5rem;
    height: 1.5rem;
    font-size: 1.25rem;
    font-weight: 600;
}

.gbs-sales-month-picker__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
    padding: 0.65rem;
}

.gbs-sales-month-picker__month {
    padding: 0.55rem 0.45rem;
    border: 1px solid #e2e8f0;
    border-radius: 0.45rem;
    background: #fff;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #334155;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.gbs-sales-month-picker__month:hover:not(:disabled) {
    border-color: var(--gbs-ud-blue-light);
    background: #eef2f9;
}

.gbs-sales-month-picker__month.is-selected {
    border-color: var(--gbs-ud-blue);
    background: var(--gbs-ud-blue);
    color: #fff;
}

.gbs-sales-month-picker__month.is-disabled,
.gbs-sales-month-picker__month:disabled {
    opacity: 0.38;
    cursor: not-allowed;
    background: #f8fafc;
}

.gbs-sales-project-picker {
    position: relative;
    min-width: 12rem;
}

.gbs-sales-project-picker__field {
    position: relative;
}

.gbs-sales-project-picker__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.35rem;
    min-height: 0;
}

.gbs-sales-project-picker__chip {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
    padding: 0.15rem 0.45rem 0.15rem 0.55rem;
    border-radius: 999px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    font-size: 0.75rem;
    font-weight: 600;
    color: #1e40af;
}

.gbs-sales-project-picker__chip-label {
    max-width: 10rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gbs-sales-project-picker__chip-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1;
    cursor: pointer;
}

.gbs-sales-project-picker__chip-remove:hover {
    background: #dbeafe;
    color: #1e3a8a;
}

.gbs-sales-project-picker__list {
    position: absolute;
    z-index: 40;
    left: 0;
    right: 0;
    margin: 0.25rem 0 0;
    padding: 0.25rem;
    list-style: none;
    max-height: 14rem;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    border-radius: 0.75rem;
    border: 1px solid #e2e8f0;
    background: #fff;
    box-shadow: 0 10px 24px -8px rgba(15, 23, 42, 0.18);
}

.gbs-sales-project-picker__option {
    padding: 0.45rem 0.65rem;
    font-size: 0.8125rem;
    border-radius: 0.5rem;
    cursor: pointer;
    color: #1e293b;
}

.gbs-sales-project-picker__option:hover {
    background: #eff6ff;
}

.gbs-sales-project-picker__hint,
.gbs-sales-project-picker__empty {
    padding: 0.45rem 0.65rem;
    font-size: 0.8125rem;
    color: #64748b;
    pointer-events: none;
}

.gbs-sales-performance-table {
    border: 1px solid var(--gbs-table-border);
    border-radius: 0.5rem;
    background: #fff;
}

.gbs-sales-performance-table__scroll {
    max-height: min(70vh, 32rem);
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border-radius: inherit;
}

.gbs-sales-performance-table__grid {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: #fff;
}

.gbs-sales-performance-table__grid th,
.gbs-sales-performance-table__grid td {
    box-sizing: border-box;
    border: 1px solid var(--gbs-table-border-cell);
    vertical-align: middle;
}

.gbs-sales-performance-table__grid thead th {
    position: sticky;
    top: 0;
    z-index: 5;
    font-weight: 700;
    color: var(--gbs-table-head-color);
    background-color: var(--gbs-table-head-bg);
    border-color: var(--gbs-table-border);
    white-space: nowrap;
}

.gbs-sales-performance-table__grid thead .gbs-sp-col-project {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 10;
    box-shadow:
        0 1px 0 var(--gbs-table-border-cell),
        6px 0 12px -6px rgba(15, 23, 42, 0.22);
}

.gbs-sales-performance-table__grid tbody tr:nth-child(even) td {
    background: var(--gbs-table-row-alt);
}

.gbs-sales-performance-table__grid tbody tr:hover td {
    background: var(--gbs-table-row-hover);
}

.gbs-sales-performance-table__grid tbody .gbs-sp-col-project {
    position: sticky;
    left: 0;
    z-index: 3;
    background-color: #fff;
    box-shadow: 6px 0 12px -6px rgba(15, 23, 42, 0.22);
}

.gbs-sales-performance-table__grid tbody tr:nth-child(even) .gbs-sp-col-project {
    background-color: var(--gbs-table-row-alt);
}

.gbs-sales-performance-table__grid tbody tr:hover .gbs-sp-col-project {
    background-color: var(--gbs-table-row-hover);
}

.gbs-sales-performance-table .gbs-sp-col-project {
    width: 7.5rem;
    min-width: 7.5rem;
}

.gbs-sales-performance-table .gbs-sp-col-amount {
    width: 9.5rem;
    min-width: 9.5rem;
    font-variant-numeric: tabular-nums;
}

.gbs-sales-performance-table .gbs-sp-col-total {
    width: 12rem;
    min-width: 12rem;
    font-variant-numeric: tabular-nums;
}

.gbs-sales-section-subnav__track {
    display: inline-flex;
    align-items: stretch;
    gap: 0.25rem;
    padding: 0.2rem;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    background: #f8fafc;
}

.gbs-sales-section-subnav__tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #475569;
    text-decoration: none;
    border-radius: 0.375rem;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.gbs-sales-section-subnav__tab:hover {
    background: #eef2f9;
    color: var(--gbs-ud-blue);
}

.gbs-sales-section-subnav__tab.is-active {
    background: var(--gbs-ud-blue);
    color: #fff;
}

.gbs-sales-performance-table .gbs-sp-col-dept {
    min-width: 6rem;
    max-width: 10rem;
}

.gbs-sales-performance-table .gbs-sp-col-target,
.gbs-sales-performance-table .gbs-sp-col-pct {
    min-width: 5.5rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.gbs-sales-performance-header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem 1rem;
}

.gbs-sales-view-toggle {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    overflow: hidden;
    background: #f8fafc;
    flex-shrink: 0;
}

.gbs-sales-view-toggle__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.5rem;
    padding: 0.45rem 0.85rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #475569;
    text-decoration: none;
    border-right: 1px solid #cbd5e1;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.gbs-sales-view-toggle__btn:last-child {
    border-right: 0;
}

.gbs-sales-view-toggle__btn:hover {
    background: #eef2f9;
    color: var(--gbs-ud-blue);
}

.gbs-sales-view-toggle__btn.is-active {
    background: var(--gbs-ud-blue);
    color: #fff;
}

.gbs-sales-performance-chart {
    margin-top: 0.75rem;
    border: 1px solid var(--gbs-table-border);
    border-radius: 0.5rem;
    background: #fff;
    padding: 1rem 1rem 0.75rem;
}

.gbs-sales-performance-chart__title {
    margin: 0 0 0.75rem;
    font-size: 0.9375rem;
    font-weight: 700;
    color: #334155;
}

.gbs-sales-performance-chart__canvas-wrap {
    position: relative;
    height: min(28rem, 60vh);
    min-height: 16rem;
}

.gbs-sales-performance-chart__empty {
    padding: 2.5rem 1rem;
    text-align: center;
    font-size: 0.875rem;
    color: #64748b;
}

/* 7payment payment status — compact grid with section borders */
.gbs-7pay-status-wrap {
    border: 2px solid #334155;
    border-radius: 0.5rem;
    background: #fff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 0.06);
    width: 100%;
    overflow-x: auto;
    --gbs-7pay-status-sticky-name-left: 2.5rem;
    --gbs-7pay-status-sticky-staff-left: 12rem;
    --gbs-7pay-status-sticky-rem-left: 17.75rem;
    --gbs-7pay-status-head-row1-h: 2.25rem;
    --gbs-7pay-status-head-row2-h: 2.25rem;
    --gbs-7pay-status-body-row-h: 2.25rem;
    --gbs-7pay-status-foot-row-h: 2.25rem;
    --gbs-7pay-status-visible-rows: 15;
}

.gbs-7pay-status-wrap--body-scroll {
    overflow: auto;
    max-height: calc(
        var(--gbs-7pay-status-head-row1-h) + var(--gbs-7pay-status-head-row2-h)
        + var(--gbs-7pay-status-visible-rows) * var(--gbs-7pay-status-body-row-h)
        + var(--gbs-7pay-status-foot-row-h)
    );
}

.gbs-7pay-status-wrap--scroll {
    overflow-x: auto;
}

.gbs-7pay-status-table {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    width: 100%;
    min-width: var(--gbs-7pay-status-table-min, 40rem);
    font-size: 0.75rem;
    line-height: 1.35;
}

.gbs-7pay-status-table th,
.gbs-7pay-status-table td {
    border: 1px solid #cbd5e1;
    padding: 0.4rem 0.55rem;
    vertical-align: middle;
    white-space: nowrap;
}

.gbs-7pay-status-table thead th {
    background: #e2e8f0;
    color: #1e293b;
    font-weight: 600;
}

.gbs-7pay-status-table thead tr:first-child .gbs-7pay-status-th-month {
    border-bottom: 2px solid #334155;
}

.gbs-7pay-status-table thead tr.gbs-7pay-status-head-sub th {
    border-bottom: 2px solid #334155 !important;
}

.gbs-7pay-status-table thead th[rowspan="2"] {
    border-bottom: 2px solid #334155;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead {
    position: sticky;
    top: 0;
    z-index: 5;
    background: #e2e8f0;
    box-shadow: 0 2px 0 0 #334155;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead th {
    background: #e2e8f0;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead .gbs-7pay-status-th-month {
    background: #dce4ef;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead .gbs-7pay-status-col-total-unpaid {
    background: #f1f5f9;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table tbody tr {
    height: var(--gbs-7pay-status-body-row-h);
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table tfoot {
    position: sticky;
    bottom: 0;
    z-index: 6;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table tfoot td {
    background: #dbeafe;
    font-weight: 700;
    border-top: 2px solid #334155;
    box-shadow: 0 -2px 0 0 #334155;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table tfoot .gbs-7pay-status-col-total-unpaid {
    background: #bfdbfe;
}

.gbs-7pay-status-table .gbs-7pay-status-tfoot-label {
    text-align: left;
    color: #1e3a8a;
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-status-table tfoot .gbs-7pay-status-sticky-idx,
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-table tfoot .gbs-7pay-status-sticky-name,
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-table tfoot .gbs-7pay-status-sticky-staff,
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-table tfoot .gbs-7pay-status-sticky-rem {
    z-index: 7;
    background: #dbeafe;
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-status-table tfoot .gbs-7pay-status-col-total-unpaid {
    background: #bfdbfe;
}

.gbs-7pay-status-table .gbs-7pay-status-border-section {
    border-left: 2px solid #334155 !important;
}

.gbs-7pay-status-table .gbs-7pay-status-col-idx {
    width: 2.5rem;
    min-width: 2.5rem;
    max-width: 2.5rem;
    text-align: center;
    color: #64748b;
}

.gbs-7pay-status-table .gbs-7pay-status-col-name {
    width: 9.5rem;
    min-width: 9.5rem;
    max-width: 9.5rem;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-7pay-status-table .gbs-7pay-status-col-staff {
    width: 5.75rem;
    min-width: 5.75rem;
    max-width: 5.75rem;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-7pay-status-table .gbs-7pay-status-col-rem {
    width: 11rem;
    min-width: 11rem;
    max-width: 11rem;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.6875rem;
}

.gbs-7pay-status-table .gbs-7pay-status-col-money {
    width: 5.35rem;
    min-width: 5.35rem;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.gbs-7pay-status-table .gbs-7pay-status-col-paid {
    width: 3.25rem;
    min-width: 3.25rem;
    text-align: center;
}

.gbs-7pay-status-inclusion-note {
    margin-left: 0.2rem;
    font-size: 0.6875rem;
    font-weight: 500;
    color: #64748b;
    white-space: nowrap;
}

.gbs-7pay-status-table .gbs-7pay-status-col-total-unpaid {
    width: 6rem;
    min-width: 6rem;
    max-width: 6rem;
    text-align: right;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    background: #f1f5f9;
}

.gbs-7pay-status-table .gbs-7pay-status-th-month {
    text-align: center;
    background: #dce4ef;
    min-width: calc(3 * 5.35rem + 3.25rem);
}

.gbs-7pay-status-colgroup-grow {
    min-width: 3.25rem;
}

.gbs-7pay-status-table tbody tr:nth-child(even) td {
    background: #f8fafc;
}

.gbs-7pay-status-table tbody tr:nth-child(even) td.gbs-7pay-status-col-total-unpaid {
    background: #eef2f6;
}

.gbs-7pay-status-table tbody tr:hover td {
    background: #edf4fa;
}

.gbs-7pay-status-table tbody tr:hover td.gbs-7pay-status-col-total-unpaid {
    background: #e2eaf3;
}

.gbs-7pay-status-table .gbs-7pay-status-empty {
    color: #94a3b8;
}

.gbs-7pay-status-table .gbs-7pay-status-paid-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 9999px;
    font-size: 0.7rem;
    font-weight: 700;
    line-height: 1;
}

.gbs-7pay-status-table .gbs-7pay-status-paid-icon--yes {
    background: #d1fae5;
    color: #047857;
}

.gbs-7pay-status-table .gbs-7pay-status-paid-icon--pending {
    background: #fef3c7;
    color: #b45309;
}

.gbs-7pay-status-table .gbs-7pay-status-paid-icon--no {
    background: #ffe4e6;
    color: #be123c;
}

/* Sticky # / name / staff no / rem id while scrolling horizontally */
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-idx,
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-name,
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-staff,
.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-rem {
    position: sticky;
    z-index: 2;
    background-clip: padding-box;
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-idx {
    left: 0;
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-name {
    left: var(--gbs-7pay-status-sticky-name-left);
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-staff {
    left: var(--gbs-7pay-status-sticky-staff-left);
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-status-sticky-rem {
    left: var(--gbs-7pay-status-sticky-rem-left);
}

.gbs-7pay-status-sticky-rem.gbs-7pay-status-sticky-edge {
    border-right: 2px solid #334155 !important;
    box-shadow: 2px 0 4px -2px rgb(15 23 42 / 0.12);
}

.gbs-7pay-status-wrap--scroll thead .gbs-7pay-status-sticky-idx,
.gbs-7pay-status-wrap--scroll thead .gbs-7pay-status-sticky-name,
.gbs-7pay-status-wrap--scroll thead .gbs-7pay-status-sticky-staff,
.gbs-7pay-status-wrap--scroll thead .gbs-7pay-status-sticky-rem {
    z-index: 7;
    background: #e2e8f0;
}

.gbs-7pay-status-wrap--scroll tbody .gbs-7pay-status-sticky-idx,
.gbs-7pay-status-wrap--scroll tbody .gbs-7pay-status-sticky-name,
.gbs-7pay-status-wrap--scroll tbody .gbs-7pay-status-sticky-staff,
.gbs-7pay-status-wrap--scroll tbody .gbs-7pay-status-sticky-rem {
    z-index: 4;
    background: #fff;
}

.gbs-7pay-status-wrap--scroll tbody tr:nth-child(even) .gbs-7pay-status-sticky-idx,
.gbs-7pay-status-wrap--scroll tbody tr:nth-child(even) .gbs-7pay-status-sticky-name,
.gbs-7pay-status-wrap--scroll tbody tr:nth-child(even) .gbs-7pay-status-sticky-staff,
.gbs-7pay-status-wrap--scroll tbody tr:nth-child(even) .gbs-7pay-status-sticky-rem {
    background: #f8fafc;
}

.gbs-7pay-status-wrap--scroll tbody tr:hover .gbs-7pay-status-sticky-idx,
.gbs-7pay-status-wrap--scroll tbody tr:hover .gbs-7pay-status-sticky-name,
.gbs-7pay-status-wrap--scroll tbody tr:hover .gbs-7pay-status-sticky-staff,
.gbs-7pay-status-wrap--scroll tbody tr:hover .gbs-7pay-status-sticky-rem {
    background: #edf4fa;
}

/* Blue-tinted scrollbars (main column style) */
.gbs-scroll-blue {
    scrollbar-width: thin;
    scrollbar-color: rgba(74, 127, 184, 0.38) rgba(148, 163, 184, 0.12);
}

.gbs-scroll-blue::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.gbs-scroll-blue::-webkit-scrollbar-track {
    background: rgba(148, 163, 184, 0.1);
    border-radius: 9999px;
}

.gbs-scroll-blue::-webkit-scrollbar-thumb {
    background: rgba(74, 127, 184, 0.35);
    border-radius: 9999px;
    border: 2px solid transparent;
    background-clip: padding-box;
}

.gbs-scroll-blue::-webkit-scrollbar-thumb:hover {
    background: rgba(74, 127, 184, 0.52);
    background-clip: padding-box;
}

.gbs-scroll-blue::-webkit-scrollbar-corner {
    background: rgba(148, 163, 184, 0.08);
}

/* 7payment CSV preview — same grid/freeze pattern as balance check */
.gbs-7pay-csv-preview-wrap.gbs-7pay-status-wrap--body-scroll {
    max-height: calc(
        var(--gbs-7pay-status-head-row1-h)
        + var(--gbs-7pay-status-visible-rows) * var(--gbs-7pay-status-body-row-h)
    );
}

.gbs-7pay-csv-preview-wrap > .gbs-7pay-csv-status-resize.gbs-table-wrap {
    overflow: visible;
    border: none;
    border-radius: 0;
    background: transparent;
}

.gbs-7pay-csv-preview-wrap .gbs-7pay-csv-status-resize.gbs-table-wrap > table.gbs-7pay-status-table {
    border-collapse: separate;
    border-spacing: 0;
}

.gbs-7pay-csv-preview-wrap.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead {
    position: sticky;
    top: 0;
    z-index: 8;
}

.gbs-7pay-csv-preview-wrap.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead th {
    position: sticky;
    top: 0;
    z-index: 8;
    background: #e2e8f0;
}

.gbs-7pay-csv-col-staff {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-7pay-csv-status-resize.gbs-table-wrap--col-resize > table {
    width: max-content;
    min-width: 100%;
}

.gbs-7pay-csv-status-resize.gbs-table-wrap--col-resize > table thead th.gbs-7pay-csv-sticky-staff,
.gbs-7pay-csv-status-resize.gbs-table-wrap--col-resize > table tbody td.gbs-7pay-csv-sticky-staff {
    position: sticky !important;
    left: 0 !important;
}

.gbs-7pay-status-wrap--scroll .gbs-7pay-csv-sticky-staff {
    position: sticky;
    left: 0;
    z-index: 6;
    background-clip: padding-box;
}

.gbs-7pay-csv-preview-wrap .gbs-7pay-csv-sticky-edge {
    border-right: none !important;
    box-shadow: 2px 0 0 0 #334155;
}

.gbs-7pay-csv-sticky-edge {
    border-right: 2px solid #334155 !important;
    box-shadow: 2px 0 4px -2px rgb(15 23 42 / 0.12);
}

.gbs-7pay-status-wrap--scroll thead .gbs-7pay-csv-sticky-staff {
    z-index: 12;
    background: #e2e8f0;
}

.gbs-7pay-csv-preview-wrap.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead th.gbs-7pay-csv-sticky-staff {
    z-index: 13;
}

.gbs-7pay-status-wrap--scroll tbody .gbs-7pay-csv-sticky-staff {
    z-index: 6;
    background: #fff;
}

.gbs-7pay-status-wrap--scroll tbody tr:nth-child(even) .gbs-7pay-csv-sticky-staff {
    background: #f8fafc;
}

.gbs-7pay-status-wrap--scroll tbody tr:hover .gbs-7pay-csv-sticky-staff {
    background: #edf4fa;
}

.gbs-7pay-csv-row-warn td {
    background: #fffbeb;
}

.gbs-7pay-status-wrap--scroll tbody tr.gbs-7pay-csv-row-warn .gbs-7pay-csv-sticky-staff {
    background: #fffbeb;
}

.gbs-7pay-status-wrap--scroll tbody tr.gbs-7pay-csv-row-warn:hover td,
.gbs-7pay-status-wrap--scroll tbody tr.gbs-7pay-csv-row-warn:hover .gbs-7pay-csv-sticky-staff {
    background: #fef3c7;
}

.gbs-7pay-status-wrap--body-scroll .gbs-7pay-status-table thead tr:only-child th {
    border-bottom: 2px solid #334155;
}

.gbs-7pay-inclusion-table .gbs-7pay-inclusion-col-money {
    min-width: 5.5rem;
    padding-right: 1.25rem !important;
    white-space: nowrap;
}

.gbs-7pay-inclusion-table .gbs-7pay-inclusion-col-id {
    min-width: 4rem;
    padding-left: 0.75rem;
    padding-right: 1rem;
    white-space: nowrap;
    color: #64748b;
}

.gbs-7pay-inclusion-table .gbs-7pay-inclusion-col-action {
    width: 1%;
    white-space: nowrap;
    text-align: right;
    padding-left: 0.75rem;
}

.gbs-7pay-inclusion-muted {
    font-size: 0.6875rem;
    color: #94a3b8;
}

.gbs-7pay-inclusion-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.625rem;
    padding: 0.125rem 0.625rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 600;
    line-height: 1.25;
    border: 1px solid;
    background: #fff;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.gbs-7pay-inclusion-btn--add {
    color: #047857;
    border-color: #a7f3d0;
}

.gbs-7pay-inclusion-btn--add:hover {
    background: #ecfdf5;
    border-color: #059669;
}

.gbs-7pay-inclusion-btn--remove {
    color: #be123c;
    border-color: #fecdd3;
}

.gbs-7pay-inclusion-btn--remove:hover {
    background: #fff1f2;
    border-color: #f43f5e;
}

/* Employment insurance — sticky header + staff no / name columns */
.gbs-ei-table-wrap {
    --gbs-ei-col-id-w: 80px;
    --gbs-ei-col-staff-w: 116px;
    --gbs-ei-col-name-w: 168px;
    --gbs-ei-sticky-staff-left: var(--gbs-ei-col-id-w);
    --gbs-ei-sticky-name-left: calc(var(--gbs-ei-col-staff-w) + var(--gbs-ei-col-id-w));
    --gbs-ei-head-row-h: 2.5rem;
    --gbs-ei-body-row-h: 2.35rem;
    --gbs-ei-visible-rows: 18;
    scrollbar-gutter: stable;
}

.gbs-ei-table-wrap--scroll {
    overflow: auto;
}

.gbs-ei-table-wrap--body-scroll {
    max-height: calc(
        var(--gbs-ei-head-row-h) + var(--gbs-ei-visible-rows) * var(--gbs-ei-body-row-h)
    );
}

.gbs-ei-table-wrap > .gbs-ei-table {
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    width: var(--gbs-ei-table-min-w, 48rem);
    min-width: 100%;
}

.gbs-ei-table-wrap .gbs-ei-col--id { width: var(--gbs-ei-col-id-w); }
.gbs-ei-table-wrap .gbs-ei-col--staff_no { width: var(--gbs-ei-col-staff-w); }
.gbs-ei-table-wrap .gbs-ei-col--name { width: 168px; }
.gbs-ei-table-wrap .gbs-ei-col--is_enrolled { width: 92px; }
.gbs-ei-table-wrap .gbs-ei-col--enrollment_situation { width: 112px; }
.gbs-ei-table-wrap .gbs-ei-col--handling_status { width: 140px; }
.gbs-ei-table-wrap .gbs-ei-col--enrolled_date,
.gbs-ei-table-wrap .gbs-ei-col--withdrawn_date { width: 124px; }
.gbs-ei-table-wrap .gbs-ei-col--employee_insurance_no { width: 152px; }
.gbs-ei-table-wrap .gbs-ei-col--company_contract { width: 84px; }
.gbs-ei-table-wrap .gbs-ei-col--notes { width: 360px; min-width: 180px; }
.gbs-ei-table-wrap .gbs-ei-col--salary { width: 112px; }
.gbs-ei-table-wrap .gbs-ei-col--deduction_amount { width: 136px; }
.gbs-ei-table-wrap .gbs-ei-col--insurance_percentage { width: 88px; }
.gbs-ei-table-wrap .gbs-ei-col--salary_month,
.gbs-ei-table-wrap .gbs-ei-col--payment_month,
.gbs-ei-table-wrap .gbs-ei-col--offset_month { width: 96px; }

.gbs-ei-table-wrap .gbs-ei-th,
.gbs-ei-table-wrap .gbs-ei-td:not(.gbs-ei-td--notes) {
    box-sizing: border-box;
    padding: 0.5rem 0.75rem;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gbs-ei-table-wrap .gbs-ei-th {
    font-weight: 700;
    color: var(--gbs-table-head-color);
    background: var(--gbs-table-head-bg);
}

.gbs-ei-table-wrap .gbs-ei-td {
    font-size: 0.75rem;
    color: #334155;
}

.gbs-ei-table-wrap .gbs-ei-td--notes {
    white-space: pre-wrap !important;
    overflow: visible;
    line-height: 1.35;
    vertical-align: top;
    text-align: left !important;
    word-break: break-word;
    overflow-wrap: anywhere;
    text-overflow: clip;
}

.gbs-ei-table-wrap .gbs-ei-td--notes .ei-cell-display,
.gbs-ei-table-wrap .gbs-ei-td--notes .ei-cell-display--notes {
    display: block;
    width: 100%;
    max-width: 100%;
    white-space: pre-wrap !important;
    text-align: left !important;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.gbs-ei-table-wrap.gbs-table-wrap--col-resize > table tbody td.gbs-ei-td--notes {
    overflow: visible;
    text-overflow: clip;
    white-space: pre-wrap !important;
    text-align: left !important;
}

.gbs-ei-table-wrap .gbs-ei-th.gbs-ei-align-left {
    text-align: left !important;
}

.gbs-ei-table-wrap .gbs-ei-td--notes.ei-editable.is-editing {
    vertical-align: top;
    padding: 0.25rem 0.5rem !important;
    white-space: normal;
    overflow: visible;
}

.gbs-ei-table-wrap .gbs-ei-td--notes.ei-editable.is-editing .ei-cell-display {
    display: none !important;
}

.gbs-ei-table-wrap .gbs-ei-td--notes.ei-editable.is-editing .ei-inline-textarea {
    display: block;
    width: 100%;
    min-height: 1.75rem;
    margin: 0;
    box-sizing: border-box;
    field-sizing: content;
}

.gbs-ei-table-wrap .gbs-ei-align-left { text-align: left; }

.gbs-ei-table-wrap .gbs-ei-align-right { text-align: right; }
.gbs-ei-table-wrap .gbs-ei-align-center { text-align: center; }
.gbs-ei-table-wrap .gbs-ei-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }

.gbs-ei-table-wrap .gbs-ei-table thead {
    position: sticky;
    top: 0;
    z-index: 5;
}

.gbs-ei-table-wrap .gbs-ei-table thead th {
    box-shadow: 0 1px 0 var(--gbs-table-border);
}

.gbs-ei-table-wrap .gbs-ei-sticky-id,
.gbs-ei-table-wrap .gbs-ei-sticky-staff,
.gbs-ei-table-wrap .gbs-ei-sticky-staff-no,
.gbs-ei-table-wrap .gbs-ei-sticky-name {
    position: sticky;
    z-index: 2;
    background-clip: padding-box;
}

.gbs-ei-table-wrap .gbs-ei-sticky-staff-no {
    left: 0;
    width: var(--gbs-ei-col-staff-w) !important;
    min-width: var(--gbs-ei-col-staff-w) !important;
    max-width: var(--gbs-ei-col-staff-w) !important;
}

.gbs-ei-table-wrap .gbs-ei-sticky-name {
    left: var(--gbs-ei-col-staff-w);
    width: var(--gbs-ei-col-name-w) !important;
    min-width: var(--gbs-ei-col-name-w) !important;
    max-width: var(--gbs-ei-col-name-w) !important;
}

.gbs-ei-table-wrap .gbs-ei-sticky-id {
    left: 0;
    width: var(--gbs-ei-col-id-w) !important;
    min-width: var(--gbs-ei-col-id-w) !important;
    max-width: var(--gbs-ei-col-id-w) !important;
}

.gbs-ei-table-wrap .gbs-ei-sticky-staff {
    left: var(--gbs-ei-sticky-staff-left);
    width: var(--gbs-ei-col-staff-w) !important;
    min-width: var(--gbs-ei-col-staff-w) !important;
    max-width: var(--gbs-ei-col-staff-w) !important;
}

.gbs-ei-table-wrap .gbs-ei-sticky-edge {
    border-right: 2px solid var(--gbs-table-border) !important;
    box-shadow: 2px 0 4px -2px rgb(15 23 42 / 0.1);
}

.gbs-ei-table-wrap .gbs-ei-table thead .gbs-ei-sticky-id,
.gbs-ei-table-wrap .gbs-ei-table thead .gbs-ei-sticky-staff,
.gbs-ei-table-wrap .gbs-ei-table thead .gbs-ei-sticky-staff-no,
.gbs-ei-table-wrap .gbs-ei-table thead .gbs-ei-sticky-name {
    z-index: 7;
    background: var(--gbs-table-head-bg);
}

.gbs-ei-table-wrap .gbs-ei-table tbody .gbs-ei-sticky-id,
.gbs-ei-table-wrap .gbs-ei-table tbody .gbs-ei-sticky-staff,
.gbs-ei-table-wrap .gbs-ei-table tbody .gbs-ei-sticky-staff-no,
.gbs-ei-table-wrap .gbs-ei-table tbody .gbs-ei-sticky-name {
    z-index: 4;
    background: #fff;
}

.gbs-ei-table-wrap .gbs-ei-table tbody tr:nth-child(even) .gbs-ei-sticky-id,
.gbs-ei-table-wrap .gbs-ei-table tbody tr:nth-child(even) .gbs-ei-sticky-staff,
.gbs-ei-table-wrap .gbs-ei-table tbody tr:nth-child(even) .gbs-ei-sticky-staff-no,
.gbs-ei-table-wrap .gbs-ei-table tbody tr:nth-child(even) .gbs-ei-sticky-name {
    background: var(--gbs-table-row-alt);
}

.gbs-ei-table-wrap .gbs-ei-table tbody tr:hover .gbs-ei-sticky-id,
.gbs-ei-table-wrap .gbs-ei-table tbody tr:hover .gbs-ei-sticky-staff,
.gbs-ei-table-wrap .gbs-ei-table tbody tr:hover .gbs-ei-sticky-staff-no,
.gbs-ei-table-wrap .gbs-ei-table tbody tr:hover .gbs-ei-sticky-name {
    background: var(--gbs-table-row-hover);
}

.gbs-ei-table-wrap.gbs-table-wrap > table tbody td.ei-editable {
    cursor: text;
}

.gbs-ei-table-wrap.gbs-table-wrap > table tbody td.ei-editable.is-editing {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
}

.gbs-ei-table-wrap.gbs-table-wrap > table tbody td.ei-editable:hover,
.gbs-ei-table-wrap.gbs-table-wrap > table tbody tr:hover td.ei-editable:hover,
.gbs-ei-table-wrap.gbs-table-wrap > table tbody td.ei-handling-cell:hover,
.gbs-ei-table-wrap.gbs-table-wrap > table tbody tr:hover td.ei-handling-cell:hover,
.gbs-ei-table-wrap.gbs-table-wrap > table tbody td.ei-target-cell:hover,
.gbs-ei-table-wrap.gbs-table-wrap > table tbody tr:hover td.ei-target-cell:hover {
    background: #fffbeb;
}

.gbs-ei-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 4.5rem;
    padding: 0.2rem 0.55rem;
    border-radius: 9999px;
    font-size: 0.6875rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.01em;
    border: 1px solid transparent;
    white-space: nowrap;
}

.gbs-ei-badge--ok { color: #166534; background: #dcfce7; border-color: #86efac; }
.gbs-ei-badge--muted { color: #475569; background: #f1f5f9; border-color: #cbd5e1; }
.gbs-ei-badge--neutral { color: #64748b; background: #f8fafc; border-color: #e2e8f0; }
.gbs-ei-badge--warn-1 { color: #854d0e; background: #fef9c3; border-color: #fde047; }
.gbs-ei-badge--warn-2 { color: #9a3412; background: #ffedd5; border-color: #fdba74; }
.gbs-ei-badge--warn-3 { color: #c2410c; background: #fed7aa; border-color: #fb923c; }
.gbs-ei-badge--danger { color: #b91c1c; background: #fee2e2; border-color: #fca5a5; }
.gbs-ei-badge--info { color: #1d4ed8; background: #dbeafe; border-color: #93c5fd; }
.gbs-ei-badge--skip { color: #6d28d9; background: #ede9fe; border-color: #c4b5fd; }
.gbs-ei-badge--listup { color: #64748b; background: #f1f5f9; border-color: #cbd5e1; }
.gbs-ei-badge--dattai { color: #b91c1c; background: #fee2e2; border-color: #fca5a5; }

.gbs-ei-table-wrap .ei-handling-select {
    font-weight: 600;
    border-width: 1px;
    border-style: solid;
    border-radius: 9999px;
    padding: 0.15rem 0.45rem;
    text-align: center;
    cursor: pointer;
}

.gbs-ei-table-wrap .ei-handling-select--neutral { color: #64748b; background: #f8fafc; border-color: #cbd5e1; }
.gbs-ei-table-wrap .ei-handling-select--info { color: #1d4ed8; background: #dbeafe; border-color: #93c5fd; }
.gbs-ei-table-wrap .ei-handling-select--skip { color: #6d28d9; background: #ede9fe; border-color: #c4b5fd; }
.gbs-ei-table-wrap .ei-handling-select--ok { color: #166534; background: #dcfce7; border-color: #86efac; }

.gbs-ei-table-wrap .ei-target-select {
    font-weight: 700;
    border-width: 1px;
    border-style: solid;
    border-radius: 9999px;
    padding: 0.15rem 0.35rem;
    text-align: center;
    cursor: pointer;
}

.gbs-ei-table-wrap .ei-target-select--listup { color: #64748b; background: #f1f5f9; border-color: #cbd5e1; }
.gbs-ei-table-wrap .ei-target-select--ok { color: #166534; background: #dcfce7; border-color: #86efac; }
.gbs-ei-table-wrap .ei-target-select--dattai { color: #b91c1c; background: #fee2e2; border-color: #fca5a5; }

.gbs-ei-table-wrap .ei-handling-cell.is-saved { animation: gbs-ei-flash 0.8s ease; }
@keyframes gbs-ei-flash { from { background: #dcfce7; } to { background: transparent; } }

.gbs-ei-enrollment-target--listup {
    color: #64748b;
    background: #f1f5f9;
    border-color: #cbd5e1;
}