:root {
    --ink: #172033;
    --muted: #6b7280;
    --line: #e5e9f2;
    --soft: #f5f7fb;
    --sidebar: #101827;
    --primary: #2563eb;
    --primary-dark: #1d4ed8;
}

.goals-dashboard {
    width: 100%;
}

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

.goal-card {
    --goal-accent: #2e6bfb;
    --goal-soft: #eef4ff;
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 22px;
    box-shadow: 0 18px 45px rgba(15, 23, 42, 0.06);
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-height: 300px;
    overflow: hidden;
    padding: 24px;
    position: relative;
}

.goal-card::before {
    background: var(--goal-accent);
    content: "";
    height: 4px;
    inset: 0 0 auto;
    position: absolute;
}

.goal-card-blue {
    --goal-accent: #2e6bfb;
    --goal-soft: #eef4ff;
}

.goal-card-green {
    --goal-accent: #15945f;
    --goal-soft: #eaf8f1;
}

.goal-card-purple {
    --goal-accent: #8b5cf6;
    --goal-soft: #f3edff;
}

.goal-card-red {
    --goal-accent: #e63946;
    --goal-soft: #fff0f2;
}

.goal-card-amber {
    --goal-accent: #f59e0b;
    --goal-soft: #fff7e6;
}

.goal-card-cyan {
    --goal-accent: #06b6d4;
    --goal-soft: #ecfeff;
}

.goal-card-header {
    align-items: center;
    display: flex;
    gap: 16px;
    padding-right: 46px;
}

.goal-icon {
    align-items: center;
    background: var(--goal-soft);
    border-radius: 16px;
    color: var(--goal-accent);
    display: inline-flex;
    flex: 0 0 56px;
    font-size: 28px;
    height: 56px;
    justify-content: center;
    width: 56px;
}

.goal-card h2 {
    color: #080b3f;
    font-size: 22px;
    font-weight: 650;
    line-height: 1.2;
    margin: 0;
}

.goal-card small,
.goal-value-grid span,
.goal-progress-label span {
    color: #667085;
}

.goal-edit-btn {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 12px;
    color: #085bcb;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    position: absolute;
    right: 18px;
    top: 18px;
    transition: 200ms ease;
    width: 38px;
}

.goal-edit-btn:hover {
    box-shadow: 0 10px 22px rgba(8, 91, 203, 0.14);
    transform: translateY(-1px);
}

.goal-value-grid {
    border: 1px solid #e5e7eb;
    border-radius: 18px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
}

.goal-value-grid div {
    padding: 16px;
}

.goal-value-grid div + div {
    border-left: 1px solid #e5e7eb;
}

.goal-value-grid strong {
    color: #080b3f;
    display: block;
    font-size: 24px;
    line-height: 1.1;
    margin-top: 8px;
}

.goal-progress-label {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.goal-progress-label strong {
    color: #080b3f;
    font-size: 18px;
}

.goal-progress-track {
    background: #e8edf5;
    border-radius: 999px;
    height: 10px;
    overflow: hidden;
}

.goal-progress-track span {
    background: var(--goal-accent);
    border-radius: inherit;
    display: block;
    height: 100%;
}

.goal-card-footer {
    margin-top: auto;
}

.goal-status {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 13px;
    font-weight: 650;
    gap: 8px;
    padding: 8px 12px;
}

.goal-status i {
    font-size: 8px;
}

.goal-status-success {
    background: #dcfce7;
    color: #0f7a47;
}

.goal-status-warning {
    background: #fff3cd;
    color: #9a5b00;
}

.goal-status-danger {
    background: #fee2e2;
    color: #b91c1c;
}

.goal-modal .modal-header,
.goal-modal .modal-footer {
    border-color: #e5e7eb;
}

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

@media (max-width: 767.98px) {
    .goals-grid {
        grid-template-columns: 1fr;
    }

    .goal-card {
        min-height: auto;
        padding: 20px;
    }

    .goal-value-grid {
        grid-template-columns: 1fr;
    }

    .goal-value-grid div + div {
        border-left: 0;
        border-top: 1px solid #e5e7eb;
    }
}

/* Admin project assign/edit workspace */
.admin-project-form {
    display: block;
    width: 100%;
}

.admin-project-assignment-hero {
    align-items: center;
    background:
        radial-gradient(circle at 92% 8%, rgba(46, 107, 251, .14), transparent 25%),
        linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 14px;
    overflow: hidden;
    padding: 16px 18px;
}

.admin-project-assignment-title {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}

.admin-project-assignment-icon {
    align-items: center;
    background: #2e6bfb;
    border-radius: 18px;
    box-shadow: 0 18px 34px rgba(46, 107, 251, .2);
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 22px;
    height: 50px;
    justify-content: center;
    width: 50px;
}

.admin-project-assignment-title h2 {
    color: #060a3d;
    font-size: 22px;
    font-weight: 720;
    letter-spacing: -.01em;
    line-height: 1.18;
    margin: 0;
}

.admin-project-assignment-title p {
    color: var(--muted);
    line-height: 1.55;
    margin: 0;
    max-width: 760px;
}

.admin-project-assignment-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.admin-project-assignment-meta span {
    align-items: center;
    background: #fff;
    border: 1px solid #dbe7ff;
    border-radius: 999px;
    color: #334155;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    gap: 6px;
    padding: 7px 10px;
    white-space: nowrap;
}

.admin-project-assignment-meta i {
    color: #2e6bfb;
}

.admin-project-form-layout {
    align-items: stretch;
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(0, 1.45fr) minmax(380px, .8fr);
}

.admin-project-form-primary {
    display: grid;
    gap: 14px;
}

.admin-project-form-main {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.admin-project-form-main,
.admin-project-side-card,
.admin-project-submit-bar {
    border: 1px solid #dbe4f0;
    box-shadow: 0 18px 40px rgba(15, 23, 42, .045);
}

.admin-form-section-head {
    align-items: center;
    display: flex;
    gap: 10px;
    margin-bottom: 12px;
}

.admin-form-section-icon {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 17px;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.admin-form-section-icon-blue { background: #e9efff; color: #2e6bfb; }
.admin-form-section-icon-green { background: #ecfdf3; color: #198754; }
.admin-form-section-icon-amber { background: #fffbeb; color: #b45309; }
.admin-form-section-icon-purple { background: #f5f3ff; color: #7c3aed; }
.admin-form-section-icon-red { background: #fff1f2; color: #e11d48; }

.admin-form-section-head h2 {
    color: #060a3d;
    font-size: 18px;
    font-weight: 720;
    line-height: 1.2;
    margin: 0 0 2px;
}

.admin-form-section-head p {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.25;
    margin: 0;
}

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

.admin-project-form-main .admin-project-field-grid {
    flex: 1;
    grid-template-rows: auto minmax(120px, 1fr) minmax(120px, 1fr);
}

.admin-project-field-span {
    grid-column: 1 / -1;
}

.admin-project-field-grid .form-label,
.admin-project-side-card .form-label {
    color: #111827;
    font-size: 13px;
    font-weight: 750;
    margin-bottom: 6px;
}

.admin-project-field-grid .form-control,
.admin-project-side-card .form-control,
.admin-project-side-card .form-select {
    border-color: #dbe4f0;
    border-radius: 10px;
    min-height: 40px;
}

.admin-project-field-grid .form-control:focus,
.admin-project-side-card .form-control:focus,
.admin-project-side-card .form-select:focus {
    border-color: #8bb4ff;
    box-shadow: 0 0 0 .2rem rgba(46, 107, 251, .12);
}

.admin-project-field-grid textarea.form-control {
    min-height: 96px;
}

.admin-project-form-main .admin-project-field-span {
    display: flex;
    flex-direction: column;
}

.admin-project-form-main textarea.form-control {
    flex: 1;
}

.admin-project-form-side {
    display: grid;
    gap: 14px;
}

.admin-project-side-card {
    background: #fff;
    border-radius: 16px;
    padding: 16px;
}

.admin-selected-member-card {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 14px;
    display: flex;
    gap: 10px;
    margin-top: 10px;
    padding: 10px;
}

.admin-selected-member-card .avatar {
    align-items: center;
    background: #e9efff;
    border-radius: 14px;
    color: #2e6bfb;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 16px;
    font-weight: 850;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.admin-selected-member-card strong,
.admin-selected-member-card small {
    display: block;
}

.admin-selected-member-card strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 800;
}

.admin-selected-member-card small {
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
}

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

.admin-project-side-grid small {
    color: var(--muted);
    display: block;
    font-size: 12px;
    line-height: 1.35;
    margin-top: 6px;
    min-height: 18px;
}

.admin-project-upload-zone {
    align-items: center;
    background: #fbfdff;
    border: 1.5px dashed #bfdbfe;
    border-radius: 14px;
    color: #475569;
    cursor: pointer;
    display: grid;
    gap: 5px;
    justify-items: center;
    min-height: 86px;
    padding: 16px 14px;
    text-align: center;
    transition: .18s ease;
}

.admin-project-upload-zone:hover {
    background: #f3f7ff;
    border-color: #2e6bfb;
    transform: translateY(-1px);
}

.admin-project-upload-zone i {
    color: #2e6bfb;
    font-size: 24px;
}

.admin-project-upload-zone strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 800;
}

.admin-project-upload-zone span {
    font-size: 12px;
    line-height: 1.35;
    max-width: 300px;
}

.admin-project-upload-card {
    grid-column: 1 / -1;
}

.admin-project-upload-card .admin-project-upload-zone {
    align-content: center;
}

.admin-project-submit-bar {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-top: 14px;
    padding: 12px 16px;
}

.admin-project-submit-bar strong,
.admin-project-submit-bar span {
    display: block;
}

.admin-project-submit-bar strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 760;
}

.admin-project-submit-bar span {
    color: var(--muted);
    margin-top: 3px;
}

.admin-project-submit-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

@media (max-width: 1199.98px) {
    .admin-project-form-layout {
        grid-template-columns: 1fr;
    }

    .admin-project-form-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-project-form-primary,
    .admin-project-upload-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .admin-project-assignment-hero,
    .admin-project-submit-bar {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-project-assignment-title {
        align-items: flex-start;
    }

    .admin-project-assignment-title h2 {
        font-size: 22px;
    }

    .admin-project-assignment-meta,
    .admin-project-submit-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .admin-project-submit-actions .btn {
        flex: 1;
    }

    .admin-project-form-side,
    .admin-project-side-grid,
    .admin-project-field-grid {
        grid-template-columns: 1fr;
    }
}

* { letter-spacing: 0; }
body {
    background: var(--soft);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { text-decoration: none; }
.btn, .form-control, .form-select, .input-group-text { border-radius: 8px; }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }

.login-page {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(360px, 520px) 1fr;
}
.login-panel {
    background: #fff;
    padding: clamp(32px, 6vw, 72px);
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 16px 60px rgba(15, 23, 42, .08);
    z-index: 1;
}
.login-panel h1 { font-weight: 800; margin-top: 44px; }
.login-brand, .brand {
    display: flex;
    align-items: center;
    gap: 14px;
}
.login-brand small, .brand small { display: block; color: var(--muted); font-weight: 500; }
.brand-mark {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: #fff;
    border-radius: 14px;
    background: linear-gradient(135deg, #2563eb, #0891b2);
    box-shadow: 0 12px 24px rgba(37, 99, 235, .22);
}
.brand-logo-mark {
    background: #fff;
    border: 1px solid #e5edf8;
    overflow: hidden;
    padding: 0;
    border-radius: 50%;
}
.brand-logo-mark img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    border-radius: 50%;
    padding: 2px;
}
.login-visual {
    background:
        linear-gradient(120deg, rgba(16, 24, 39, .92), rgba(37, 99, 235, .72)),
        url("https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1800&q=80") center/cover;
    color: #fff;
    display: flex;
    align-items: end;
    padding: clamp(32px, 6vw, 80px);
}
.login-visual h2 { max-width: 760px; font-size: clamp(32px, 5vw, 64px); font-weight: 850; line-height: 1.02; }
.login-metrics { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.login-metrics span { border: 1px solid rgba(255,255,255,.25); background: rgba(255,255,255,.12); padding: 14px 16px; border-radius: 8px; backdrop-filter: blur(10px); }
.login-metrics strong { display: block; }
.login-forgot-link {
    color: var(--primary);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}
.login-forgot-link:hover {
    text-decoration: underline;
}
.auth-simple-page {
    grid-template-columns: minmax(0, 640px);
    justify-content: center;
}
.auth-simple-panel {
    min-height: 100vh;
}
.signup-page {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(620px, 760px) 1fr;
    background: var(--soft);
}
.signup-panel {
    background: #fff;
    overflow-y: auto;
}
.signup-shell {
    padding: clamp(24px, 4vw, 48px);
}
.signup-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}
.signup-intro {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-end;
    margin-bottom: 22px;
}
.signup-intro h1 {
    font-size: clamp(32px, 4vw, 44px);
    font-weight: 900;
    margin: 0;
}
.signup-intro p {
    color: var(--muted);
    max-width: 600px;
    margin: 8px 0 0;
}
.signup-steps {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: end;
}
.signup-steps span {
    border: 1px solid var(--line);
    background: #fbfcff;
    border-radius: 999px;
    color: #344054;
    padding: 8px 11px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.signup-steps i {
    color: var(--primary);
    margin-right: 5px;
}
.signup-form {
    display: grid;
    gap: 16px;
}
.signup-progress {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}
.signup-progress button {
    border: 1px solid var(--line);
    background: #fbfcff;
    color: var(--muted);
    border-radius: 12px;
    padding: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: 850;
    transition: border-color .16s ease, background .16s ease, color .16s ease;
}
.signup-progress button span {
    width: 26px;
    height: 26px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: #e9eef7;
    color: #344054;
    font-size: 12px;
}
.signup-progress button.active {
    background: #eef4ff;
    border-color: #b8ccff;
    color: var(--primary);
}
.signup-progress button.active span,
.signup-progress button.complete span {
    background: var(--primary);
    color: #fff;
}
.signup-progress button.complete {
    color: var(--ink);
}
.signup-step {
    display: none;
}
.signup-step.active {
    display: block;
}
.signup-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 18px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .04);
}
.signup-card-header {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 16px;
}
.signup-card-header h2 {
    font-size: 18px;
    font-weight: 850;
    margin: 0;
}
.signup-card-header p {
    color: var(--muted);
    margin: 3px 0 0;
}
.signup-card .form-label {
    font-weight: 750;
    font-size: 13px;
}
.signup-card .form-label span,
.upload-card strong {
    color: #dc3545;
}
.signup-card .form-control {
    min-height: 44px;
}
.signup-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}
.signup-help-box {
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fbfcff;
    color: var(--muted);
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    font-size: 13px;
    font-weight: 650;
}
.signup-help-box i {
    color: var(--primary);
}
.upload-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.upload-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px;
    background: #fbfcff;
    display: grid;
    gap: 8px;
    cursor: pointer;
}
.upload-card:hover {
    border-color: #cbd5e1;
    background: #fff;
}
.upload-card > i {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #eef4ff;
    color: var(--primary);
    font-size: 18px;
}
.upload-card span {
    font-weight: 850;
}
.upload-card small {
    color: var(--muted);
    font-weight: 650;
}
.upload-card input {
    cursor: pointer;
}
.upload-card-wide {
    grid-column: 1 / -1;
}
.review-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}
.review-grid div {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 14px;
    display: grid;
    gap: 6px;
}
.review-grid i {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #eef4ff;
    color: var(--primary);
    font-size: 18px;
}
.review-grid strong {
    font-weight: 850;
}
.review-grid small {
    color: var(--muted);
}
.signup-submit {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 16px;
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: space-between;
}
.signup-submit small {
    color: var(--muted);
    display: block;
}
.signup-visual {
    background:
        linear-gradient(120deg, rgba(16, 24, 39, .92), rgba(37, 99, 235, .72)),
        url("https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1800&q=80") center/cover;
    color: #fff;
    display: flex;
    align-items: end;
    padding: clamp(32px, 6vw, 80px);
    min-width: 0;
}
.signup-visual h2 {
    max-width: 860px;
    font-size: clamp(36px, 5vw, 68px);
    font-weight: 900;
    line-height: 1.04;
}

.app-shell { display: grid; grid-template-columns: 304px 1fr; min-height: 100vh; background: #f8fafc; }
.sidebar {
    --sidebar-primary: #085bcb;
    --sidebar-brand: #181876;
    --sidebar-text: #374151;
    --sidebar-muted: #6b7280;
    --sidebar-line: #e5e7eb;
    background:
        linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(250,253,255,.98) 100%);
    border-right: 1px solid #dbe4f0;
    box-shadow: 18px 0 42px rgba(15, 23, 42, .075);
    color: var(--sidebar-text);
    padding: 24px 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 22px;
    position: sticky;
    top: 0;
    min-height: 100vh;
    max-height: 100vh;
    overflow: hidden;
    z-index: 20;
}
.sidebar .brand {
    color: inherit;
}
.sidebar .brand:hover {
    color: inherit;
}
.sidebar-brand {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 16px;
    box-shadow: none;
    display: flex;
    gap: 11px;
    padding: 6px 6px 10px;
    min-height: 74px;
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    overflow: hidden;
}
.sidebar-brand:hover {
    background: #f8fafc;
    border-color: #edf2fb;
    box-shadow: none;
    transform: none;
}
.sidebar-logo-mark {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    box-shadow: 0 8px 20px rgba(24, 24, 118, .08);
    padding: 0;
    flex: 0 0 auto;
    background: #fff;
}
.sidebar-logo-mark img {
    border-radius: 50%;
    object-fit: contain;
    image-rendering: auto;
}
.sidebar-brand-copy {
    min-width: 0;
    overflow: hidden;
}
.sidebar-brand-copy strong {
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: unset;
}
.sidebar-brand-copy strong span {
    color: var(--sidebar-brand);
}
.sidebar-brand-copy strong em {
    color: var(--sidebar-primary);
    font-style: normal;
}
.sidebar-brand-copy small {
    color: var(--sidebar-muted);
    display: block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.22;
    margin-top: 6px;
    max-width: 170px;
}
.sidebar-nav {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    overflow-y: auto;
    padding: 2px 0 8px;
}
.sidebar-nav-group {
    display: grid;
    gap: 8px;
}
.sidebar-divider {
    border-top: 1px solid var(--sidebar-line);
    display: block;
    margin: 22px 6px;
}
.sidebar .nav-link.sidebar-nav-link {
    color: var(--sidebar-text);
    border-radius: 16px;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    min-height: 52px;
    padding: 11px 16px;
    position: relative;
    font-size: 14.5px;
    font-weight: 750;
    transition: background .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sidebar .nav-link.sidebar-nav-link i {
    color: var(--sidebar-brand);
    font-size: 20.5px;
    line-height: 1;
    text-align: center;
}
.sidebar .nav-link.sidebar-nav-link span {
    min-width: 0;
}
.sidebar .nav-link.sidebar-nav-link b {
    background: #2f6bff;
    border-radius: 999px;
    color: #fff;
    display: inline-grid;
    font-size: 12px;
    font-weight: 800;
    min-width: 22px;
    height: 22px;
    line-height: 1;
    place-items: center;
    padding: 0 6px;
    box-shadow: 0 8px 18px rgba(47, 107, 255, .28);
}
.sidebar-nav-alerts {
    align-items: center;
    display: inline-flex;
    gap: 7px;
    justify-content: end;
}
.sidebar-alert-bell {
    align-items: center;
    background: #fee2e2;
    border-radius: 999px;
    color: #dc2626;
    display: inline-flex;
    height: 24px;
    justify-content: center;
    width: 24px;
}
.sidebar-alert-bell i {
    color: inherit !important;
    font-size: 13px !important;
}
.sidebar .nav-link.sidebar-nav-link:hover {
    background: #f7faff;
    color: var(--sidebar-text);
    transform: translateX(3px);
}
.sidebar .nav-link.sidebar-nav-link.active {
    background: linear-gradient(90deg, #edf5ff 0%, #f7fbff 100%);
    box-shadow: inset 0 0 0 1px #d8e8ff, 0 12px 26px rgba(8, 91, 203, .08);
    color: var(--sidebar-primary);
    font-weight: 800;
}
.sidebar .nav-link.sidebar-nav-link.active::before {
    background: var(--sidebar-primary);
    border-radius: 999px;
    content: "";
    height: 36px;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
}
.sidebar .nav-link.sidebar-nav-link.active i {
    color: var(--sidebar-brand);
}
.sidebar .nav-link.sidebar-nav-sub-link {
    grid-template-columns: 24px minmax(0, 1fr) auto;
    margin-left: 34px;
    min-height: 42px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 650;
}
.sidebar .nav-link.sidebar-nav-sub-link i {
    font-size: 16px;
}
.sidebar .nav-link.sidebar-nav-sub-link.active::before {
    height: 24px;
}
.sidebar-profile {
    background:
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    border: 1px solid #dbe4f0;
    border-radius: 16px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .075);
    color: inherit;
    display: block;
    margin-top: auto;
    padding: 18px 16px;
    text-align: center;
    transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.sidebar-profile:hover {
    border-color: #c8d7f2;
    box-shadow: 0 22px 48px rgba(8, 91, 203, .13);
    color: inherit;
    transform: translateY(-2px);
}
.sidebar-profile-avatar {
    border-radius: 50%;
    display: grid;
    height: 76px;
    margin: 0 auto 12px;
    object-fit: cover;
    place-items: center;
    width: 76px;
}
.sidebar-profile-initials {
    background: #eef5ff;
    color: var(--sidebar-primary);
    font-size: 26px;
    font-weight: 900;
}
.sidebar-profile strong,
.sidebar-profile small,
.sidebar-profile a {
    display: block;
}
.sidebar-profile strong {
    color: #111827;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
}
.sidebar-profile small {
    color: var(--sidebar-muted);
    font-size: 12.5px;
    font-weight: 400;
    line-height: 1.3;
    margin: 4px auto 0;
    max-width: 210px;
}
.sidebar-profile a {
    color: var(--sidebar-primary);
    font-size: 12.5px;
    font-weight: 750;
    margin-top: 11px;
}
.sidebar-admin-footer {
    background: #ffffff;
    border: 1px solid #dbe4f0;
    border-radius: 16px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .055);
    margin-top: auto;
    padding: 16px;
}
.sidebar-admin-kicker {
    color: var(--sidebar-muted);
    display: block;
    font-size: 11px;
    letter-spacing: .04em;
    margin-bottom: 6px;
    text-transform: uppercase;
}
.sidebar-admin-footer strong,
.sidebar-admin-footer small {
    display: block;
}
.sidebar-admin-footer strong {
    color: #111827;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.25;
}
.sidebar-admin-footer small {
    color: var(--sidebar-muted);
    font-size: 12.5px;
    line-height: 1.35;
    margin-top: 3px;
}
.profile-reject-form {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(220px, 1fr) auto;
    max-width: 560px;
}
.profile-completion-form .panel-header {
    align-items: flex-start;
}
.profile-skill-table {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.profile-skill-head,
.profile-skill-row {
    display: grid;
    grid-template-columns: minmax(190px, 1.5fr) repeat(4, minmax(74px, 1fr));
    align-items: center;
}
.profile-skill-head {
    background: #f8fafc;
    color: #111827;
    font-size: 13px;
    font-weight: 600;
    padding: 12px 16px;
}
.profile-skill-row {
    border-top: 1px solid var(--line);
    min-height: 52px;
    padding: 10px 16px;
}
.profile-skill-row strong {
    color: #111827;
    font-size: 14px;
    font-weight: 600;
}
.profile-skill-option {
    display: grid;
    margin: 0;
    place-items: center;
}
.profile-skill-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.profile-skill-option span {
    border: 2px solid #cbd5e1;
    border-radius: 6px;
    display: inline-grid;
    height: 20px;
    place-items: center;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
    width: 20px;
}
.profile-skill-option input:checked + span {
    background: var(--primary);
    border-color: var(--primary);
    box-shadow: 0 8px 18px rgba(8, 91, 203, .22);
}
.profile-skill-option input:checked + span::after {
    color: #fff;
    content: "\F26E";
    font-family: "bootstrap-icons";
    font-size: 13px;
    line-height: 1;
}
.profile-acknowledgement {
    background: #f8fbff;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    padding: 16px;
}
.profile-completion-modal {
    border: 1px solid #dbe4f0;
    border-radius: 20px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .18);
}
.profile-completion-modal .modal-title {
    color: #111827;
    font-size: 28px;
    font-weight: 650;
}
.profile-completion-modal p {
    color: var(--muted);
    margin-bottom: 16px;
}
.profile-completion-modal-list {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profile-completion-modal-list span {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: #111827;
    display: flex;
    font-size: 13px;
    gap: 8px;
    padding: 10px 12px;
}
.profile-completion-modal-list i {
    color: var(--primary);
}
.avatar {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #e9efff;
    color: #1d4ed8;
    display: inline-grid;
    place-items: center;
    font-weight: 800;
    flex: 0 0 auto;
}
.avatar-img { object-fit: cover; padding: 0; }
.avatar-xl { width: 76px; height: 76px; border-radius: 18px; font-size: 28px; }
.content { padding: 32px; min-width: 0; }
.topbar {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 22px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .05);
}
.topbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.topbar-actions form {
    display: inline-flex;
}
.activity-dropdown {
    position: relative;
}
.activity-bell-button {
    align-items: center;
    background: #fff;
    border: 1px solid #d7e2f1;
    border-radius: 12px;
    color: #181876;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    position: relative;
    transition: border-color .18s ease, box-shadow .18s ease;
    width: 42px;
}
.activity-bell-button:hover,
.activity-bell-button:focus {
    border-color: #b9cdf0;
    box-shadow: 0 10px 22px rgba(8, 91, 203, .12);
    outline: 0;
}
.activity-bell-button.has-unread i {
    animation: activityPulse 1.8s ease-in-out infinite;
}
.activity-bell-badge {
    align-items: center;
    background: #085bcb;
    border: 2px solid #fff;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: 10px;
    font-weight: 900;
    height: 19px;
    justify-content: center;
    min-width: 19px;
    padding: 0 5px;
    position: absolute;
    right: -6px;
    top: -6px;
}
@keyframes activityPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.12); }
}
.activity-menu {
    border: 1px solid #dfe6f2;
    border-radius: 16px;
    box-shadow: 0 22px 48px rgba(15, 23, 42, .16);
    overflow: hidden;
    padding: 0;
    width: min(430px, calc(100vw - 24px));
}
.activity-menu-head,
.activity-menu-foot {
    align-items: center;
    background: #f8fbff;
    display: flex;
    justify-content: space-between;
    padding: 14px 16px;
}
.activity-menu-head strong {
    color: #060a3d;
    display: block;
    font-size: 16px;
    font-weight: 850;
}
.activity-menu-head small {
    color: #64748b;
    display: block;
    font-size: 12px;
}
.activity-menu-head .btn-link,
.activity-menu-foot a {
    color: #085bcb;
    font-weight: 850;
    text-decoration: none;
}
.activity-menu-list {
    display: grid;
    gap: 8px;
    max-height: 440px;
    overflow-y: auto;
    padding: 10px;
}
.activity-menu-item,
.activity-center-row {
    align-items: center;
    background: #fff;
    border: 1px solid #e1e8f3;
    border-radius: 12px;
    display: grid;
    gap: 12px;
}
.activity-menu-item {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    padding: 10px;
}
.activity-menu-item.is-unread,
.activity-center-row.is-unread {
    background: #f3f8ff;
    border-left: 4px solid #085bcb;
}
.activity-item-icon {
    align-items: center;
    border-radius: 12px;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}
.activity-priority-high {
    background: #fff1f2;
    color: #dc2626;
}
.activity-priority-medium {
    background: #fff7ed;
    color: #f97316;
}
.activity-priority-normal {
    background: #eaf2ff;
    color: #085bcb;
}
.activity-menu-item strong {
    color: #060a3d;
    display: block;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.25;
}
.activity-menu-item p {
    color: #475569;
    font-size: 12px;
    line-height: 1.35;
    margin: 3px 0;
}
.activity-menu-item small {
    color: #64748b;
    font-size: 11px;
}
.activity-empty {
    align-items: center;
    color: #64748b;
    display: flex;
    gap: 8px;
    justify-content: center;
    min-height: 96px;
}
.activity-center-panel {
    border: 1px solid #dfe6f2;
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .04);
}
.activity-center-toolbar {
    align-items: center;
    border-bottom: 1px solid #e4e9f3;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    margin: -4px -4px 16px;
    padding: 0 0 16px;
}
.activity-filter-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.activity-filter-tabs a {
    align-items: center;
    background: #fff;
    border: 1px solid #dfe6f2;
    border-radius: 999px;
    color: #334155;
    display: inline-flex;
    font-size: 13px;
    font-weight: 800;
    gap: 7px;
    padding: 8px 11px;
    text-decoration: none;
}
.activity-filter-tabs a.active {
    background: #eaf2ff;
    border-color: #b9cdf0;
    color: #085bcb;
}
.activity-filter-tabs b {
    background: rgba(8, 91, 203, .1);
    border-radius: 999px;
    color: #085bcb;
    font-size: 11px;
    min-width: 22px;
    padding: 2px 6px;
    text-align: center;
}
.activity-center-list {
    display: grid;
    gap: 12px;
}
.activity-center-row {
    grid-template-columns: 46px minmax(0, 1fr) auto;
    padding: 14px;
}
.activity-center-copy > div {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.activity-center-copy h2 {
    color: #060a3d;
    font-size: 16px;
    font-weight: 850;
    margin: 0;
}
.activity-center-copy p {
    color: #475569;
    font-size: 14px;
    line-height: 1.45;
    margin: 5px 0;
}
.activity-center-copy small {
    color: #64748b;
    font-size: 12px;
}
.activity-priority-label {
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    padding: 4px 8px;
}
.activity-priority-label-high {
    background: #fff1f2;
    color: #be123c;
}
.activity-priority-label-medium {
    background: #fff7ed;
    color: #c2410c;
}
.activity-priority-label-normal {
    background: #eaf2ff;
    color: #085bcb;
}
.activity-pagination {
    border-top: 1px solid #e4e9f3;
    margin-top: 16px;
    padding-top: 16px;
}
.topbar-link {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.topbar-link i {
    color: #181876;
    font-size: 15px;
}
.topbar-link:hover,
.topbar-link:focus {
    background: #f8fafc;
    border-color: #bfdbfe;
    color: var(--primary);
    transform: translateY(-1px);
}
.topbar-link-primary {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: var(--primary);
}
.topbar-subtitle {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.45;
    margin: 6px 0 0;
}
.eyebrow {
    color: var(--primary);
    text-transform: uppercase;
    font-weight: 800;
    font-size: 12px;
}
.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 16px;
}
.admin-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 18px;
}
.admin-kpi-grid .stat-card {
    min-height: 96px;
}
.admin-clean-hero {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.admin-hero-status {
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 16px;
    min-width: 180px;
    padding: 16px 18px;
    text-align: right;
}
.admin-hero-status small,
.admin-hero-status span {
    color: var(--muted);
    display: block;
    font-size: 13px;
    font-weight: 650;
}
.admin-hero-status strong {
    color: var(--ink);
    display: block;
    font-size: 34px;
    line-height: 1;
    margin: 4px 0;
}
.admin-clean-kpi-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.admin-kpi-card-clean {
    min-height: 112px;
}
.admin-attention-list {
    display: grid;
    gap: 10px;
}
.admin-quick-actions {
    display: grid;
    gap: 12px;
    grid-template-columns: 1fr;
}
.admin-focus-card {
    background: #fbfcff;
}
.admin-focus-meta small,
.admin-focus-meta strong {
    display: block;
}
.admin-focus-meta small {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    margin-bottom: 4px;
}
.admin-focus-meta strong {
    color: var(--ink);
    font-size: 18px;
    font-weight: 750;
}
.admin-action-strip {
    padding-bottom: 20px;
}
.admin-focus-action-layout {
    align-items: stretch;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.55fr) minmax(320px, .8fr);
}
.admin-focus-action-layout > .panel {
    min-width: 0;
}
.admin-action-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-left: 46px;
}
.admin-action-grid-wide {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-left: 0;
}
.admin-action-grid-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-left: 0;
}
.admin-action-grid .btn {
    min-height: 42px;
}
.admin-action-grid-wide .quick-action {
    min-height: 78px;
}
.admin-action-strip-side {
    display: flex;
    flex-direction: column;
}
.admin-action-strip-side .admin-action-grid {
    flex: 1;
}
.admin-action-strip-side .quick-action {
    min-height: 112px;
}
.admin-watchlist {
    display: grid;
    gap: 10px;
}
.admin-watchlist-row {
    align-items: center;
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: var(--ink);
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(72px, auto)) auto;
    padding: 12px 14px;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.admin-watchlist-row:hover {
    border-color: #bfdbfe;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .06);
    color: var(--ink);
    transform: translateY(-1px);
}
.admin-watchlist-row span small {
    color: var(--muted);
    display: block;
    font-size: 12px;
    font-weight: 650;
}
.admin-watchlist-row span strong {
    color: var(--ink);
    display: block;
    font-size: 16px;
    font-weight: 760;
}
.admin-activity-compact {
    gap: 10px;
}
.admin-activity-compact .activity-item {
    grid-template-columns: auto 1fr;
}
.summary-board {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}
.summary-column {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0;
}
.summary-group {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 18px 18px 20px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .05);
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.summary-group-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--line);
    padding-bottom: 12px;
    margin-bottom: 14px;
}
.summary-group-header h2 {
    font-size: 17px;
    font-weight: 850;
    margin: 0;
}
.summary-group-header p {
    color: var(--muted);
    font-size: 13px;
    margin: 2px 0 0;
    max-width: 360px;
}
.summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
    flex: 1;
    align-content: start;
}
.dashboard-filter-panel {
    display: grid;
    grid-template-columns: repeat(6, minmax(130px, 1fr)) auto;
    gap: 12px;
    align-items: end;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 18px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .05);
}
.dashboard-filter-disclosure {
    margin-bottom: 18px;
}
.dashboard-filter-disclosure > summary {
    width: fit-content;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: #475569;
    cursor: pointer;
    font-size: 13px;
    font-weight: 850;
    list-style: none;
    padding: 9px 13px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .035);
}
.dashboard-filter-disclosure > summary::-webkit-details-marker {
    display: none;
}
.dashboard-filter-disclosure[open] > summary {
    border-color: #b8ccff;
    background: #eef4ff;
    color: var(--primary);
    margin-bottom: 12px;
}
.dashboard-filter-disclosure .dashboard-filter-panel {
    margin-bottom: 0;
}
.dashboard-filter-panel .form-label {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 6px;
}
.filter-actions {
    display: flex;
    gap: 8px;
}
.team-stats { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.stat-card, .panel {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .05);
}
.stat-card {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.stat-card.compact {
    box-shadow: none;
    background: #fbfcff;
    padding: 16px 18px;
    min-height: 86px;
    height: 100%;
}
.stat-card.compact .stat-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    font-size: 19px;
}
.stat-card-wide {
    grid-column: 1 / -1;
}
.summary-rate-footer {
    margin-top: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 12px 14px;
    min-height: 68px;
    color: inherit;
    background: #fbfcff;
    display: grid;
    grid-template-columns: 46px minmax(120px, 1fr) minmax(140px, .75fr);
    align-items: center;
    gap: 14px;
}
.summary-rate-footer small {
    color: var(--muted);
    display: block;
    font-weight: 750;
}
.summary-rate-footer strong {
    font-size: 24px;
    line-height: 1;
}
.summary-rate-inline {
    grid-column: span 2;
    margin-top: 0;
    min-height: 86px;
}
.summary-rate-full {
    grid-column: 1 / -1;
    margin-top: 0;
    min-height: 86px;
}
.summary-grid > .summary-rate-inline:last-child:nth-child(5) {
    grid-column: span 2;
}
.summary-meter {
    height: 9px;
    background: #e9eef7;
    border-radius: 999px;
    overflow: hidden;
}
.summary-meter span {
    display: block;
    height: 100%;
    background: #198754;
    border-radius: inherit;
}
.smart-dashboard-hero {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .05);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 24px;
    margin-bottom: 18px;
}
.smart-dashboard-hero h2 {
    color: var(--ink);
    font-size: clamp(28px, 3vw, 38px);
    font-weight: 900;
    line-height: 1.1;
    margin: 4px 0;
}
.smart-dashboard-hero p {
    color: var(--muted);
    margin: 0;
    font-weight: 700;
}
.smart-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}
.smart-action {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fbfcff;
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 850;
}
.smart-action:hover {
    background: #eef4ff;
    border-color: #b8ccff;
    color: var(--primary);
}
.smart-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}
.smart-kpi-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    color: inherit;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 92px;
    padding: 16px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.smart-kpi-card:hover {
    color: inherit;
    border-color: #b8ccff;
    box-shadow: 0 14px 32px rgba(37, 99, 235, .10);
    transform: translateY(-1px);
}
.smart-kpi-card small,
.smart-kpi-card strong {
    display: block;
}
.smart-kpi-card small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;
}
.smart-kpi-card strong {
    color: var(--ink);
    font-size: 27px;
    font-weight: 900;
    line-height: 1;
    margin-top: 4px;
}
.smart-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(340px, .75fr);
    gap: 18px;
    align-items: start;
}
.smart-bottom-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.smart-panel {
    padding: 20px;
}
.smart-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    border-bottom: 1px solid var(--line);
    padding-bottom: 12px;
    margin-bottom: 14px;
}
.smart-panel-header h2 {
    color: var(--ink);
    font-size: 18px;
    font-weight: 900;
    margin: 0;
}
.smart-panel-header p {
    color: var(--muted);
    margin: 3px 0 0;
    font-size: 13px;
    font-weight: 700;
}
.smart-attention-list {
    display: grid;
    gap: 9px;
}
.smart-attention-item {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    color: inherit;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
}
.smart-attention-item:hover {
    color: inherit;
    background: #fff;
    border-color: #cbd5e1;
}
.smart-health-stack {
    display: grid;
    gap: 10px;
}
.smart-health-row {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    color: inherit;
    display: grid;
    grid-template-columns: minmax(120px, .85fr) minmax(120px, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 74px;
    padding: 12px;
}
.smart-health-row:hover {
    color: inherit;
    background: #fff;
    border-color: #cbd5e1;
}
.smart-health-row small,
.smart-health-row strong,
.smart-health-note {
    display: block;
}
.smart-health-row small,
.smart-health-note {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.smart-health-row strong {
    color: var(--ink);
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
    margin-top: 3px;
}
.smart-mini-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.stat-card small { display: block; color: var(--muted); font-weight: 700; }
.stat-card strong { font-size: 28px; line-height: 1; }
.clickable-card {
    color: inherit;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.clickable-card:hover {
    color: inherit;
    transform: translateY(-2px);
    border-color: #cbd5e1;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
}
.stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 20px;
}
.panel { padding: 22px; }
.panel-header {
    display: flex;
    gap: 16px;
    align-items: start;
    justify-content: space-between;
    margin-bottom: 18px;
}
.panel-header h2 { font-size: 20px; font-weight: 800; margin: 0; }
.panel-header p { color: var(--muted); margin: 4px 0 0; }
.filter-bar {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(auto-fit, minmax(140px, .6fr)) auto;
    gap: 10px;
    margin-bottom: 16px;
}
.table > :not(caption) > * > * { padding: 14px 12px; }
.table-actions { white-space: nowrap; }
.table-actions form { display: inline; }
.badge { border-radius: 999px; padding: .45rem .65rem; font-weight: 750; }
.status-badge.status-in-progress {
    background-color: #ffc107 !important;
    color: #111827 !important;
}
.status-badge.status-completed,
.summary-meter span {
    background-color: #198754 !important;
}
.list-row, .alert-row, .timeline-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 0;
    color: inherit;
    border-top: 1px solid var(--line);
}
.list-row:first-of-type, .alert-row:first-of-type, .timeline-item:first-of-type { border-top: 0; }
.list-row small, .alert-row small, .timeline-item small { color: var(--muted); display: block; }
.score-pill {
    font-weight: 850;
    color: #0f766e;
    background: #e7f8f4;
    border-radius: 999px;
    padding: 7px 10px;
    white-space: nowrap;
}
.empty-state { text-align: center; padding: 42px 18px; color: var(--muted); }
.empty-state i { font-size: 42px; color: #c3ccdb; }
.empty-state h3 { color: var(--ink); font-size: 20px; font-weight: 800; margin-top: 12px; }
.form-panel { max-width: 1180px; }
.settings-grid {
    display: grid;
    gap: 18px;
}
.settings-panel {
    border: 1px solid #dfe6f2;
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .04);
}
.settings-narrow-panel {
    max-width: 980px;
}
.settings-panel-head {
    align-items: center;
    border-bottom: 1px solid #e4e9f3;
    display: flex;
    gap: 14px;
    margin: -4px 0 18px;
    padding-bottom: 16px;
}
.settings-panel-head h2 {
    color: #060a3d;
    font-size: 22px;
    font-weight: 850;
    line-height: 1.2;
    margin: 0;
}
.settings-panel-head p {
    color: #526174;
    font-size: 14px;
    margin: 4px 0 0;
}
.settings-icon {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    flex: 0 0 48px;
    font-size: 22px;
    height: 48px;
    justify-content: center;
    width: 48px;
}
.settings-icon-blue {
    background: #eaf2ff;
    color: #085bcb;
}
.settings-icon-green {
    background: #e7f8ef;
    color: #159760;
}
.settings-icon-purple {
    background: #f2eaff;
    color: #7c3aed;
}
.settings-icon-amber {
    background: #fff4dd;
    color: #f59f00;
}
.settings-form + .settings-form {
    border-top: 1px solid #e4e9f3;
    margin-top: 18px;
    padding-top: 18px;
}
.settings-form-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 18px;
}
.settings-table-wrap {
    border: 1px solid #e1e8f3;
    border-radius: 14px;
}
.settings-table {
    margin: 0;
}
.settings-table thead th {
    background: #f8fbff;
    color: #64748b;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .02em;
    text-transform: uppercase;
    white-space: nowrap;
}
.settings-table td {
    color: #334155;
    font-size: 14px;
}
.settings-table td strong,
.settings-table td span,
.settings-table td small {
    display: block;
}
.settings-table td small {
    color: #64748b;
    margin-top: 3px;
}
.settings-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
}
.settings-actions form {
    margin: 0;
}
.form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}
.section-label {
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 850;
}
.duty-row {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 10px 0;
    border-top: 1px solid var(--line);
}
.duty-row i { color: #16a34a; }
.profile-card { border-bottom: 1px solid var(--line); padding-bottom: 18px; margin-bottom: 18px; }
.profile-card h2 { font-size: 24px; margin: 14px 0 4px; font-weight: 850; }
.profile-card p { color: var(--muted); }
.detail-list { display: grid; grid-template-columns: 120px 1fr; gap: 10px 12px; }
.detail-list dt { color: var(--muted); font-weight: 750; }
.detail-list dd { margin: 0; }
.detail-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 16px;
}
.detail-card p,
.project-detail-copy p {
    color: var(--muted);
}
.task-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 12px;
}
.task-card-main {
    display: flex;
    gap: 12px;
    justify-content: space-between;
    align-items: start;
}
.task-card h3 { font-size: 18px; font-weight: 800; margin-bottom: 5px; }
.task-card p { color: var(--muted); margin-bottom: 8px; }
.badge-row { display: flex; gap: 8px; flex-wrap: wrap; justify-content: end; }
.project-card-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}
.projects-panel {
    padding: 22px;
}
.projects-panel-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
}
.project-status-tabs {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px;
}
.project-status-tabs a {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfcff;
    color: inherit;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
}
.project-status-tabs a:hover,
.project-status-tabs a.active {
    border-color: #b8ccff;
    background: #eef4ff;
}
.project-status-tabs span {
    color: var(--muted);
    font-weight: 800;
    font-size: 12px;
}
.project-status-tabs strong {
    font-size: 20px;
    line-height: 1;
}
.project-filter-bar {
    display: grid;
    grid-template-columns: minmax(260px, 1.5fr) repeat(3, minmax(150px, .7fr)) auto auto;
    gap: 10px;
    margin-bottom: 18px;
}
.project-list,
.refined-project-list {
    display: grid;
    gap: 12px;
}
.project-row-card {
    border: 1px solid var(--line);
    border-left-width: 5px;
    border-radius: 12px;
    background: #fff;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
    align-items: center;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .035);
}
.project-row-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}
.project-row-primary { border-left-color: var(--primary); }
.project-row-warning { border-left-color: #ffc107; }
.project-row-danger { border-left-color: #dc3545; }
.project-row-success { border-left-color: #198754; }
.project-row-title h3 {
    font-size: 18px;
    font-weight: 850;
    margin: 0 0 5px;
}
.project-row-title p {
    color: var(--muted);
    margin: 0;
    max-width: 780px;
}
.project-row-note {
    margin-top: 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfcff;
    padding: 10px 12px;
}
.project-row-note small {
    color: var(--muted);
    display: block;
    font-size: 11px;
    font-weight: 850;
    text-transform: uppercase;
}
.project-row-note span {
    color: #344054;
    display: block;
    font-weight: 650;
    margin-top: 2px;
}
.project-row-details {
    display: grid;
    gap: 12px;
    justify-items: end;
}
.project-row-badges {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    justify-content: end;
}
.project-row-date {
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fbfcff;
    padding: 10px 12px;
    min-width: 230px;
    display: grid;
    grid-template-columns: 18px 1fr;
    gap: 2px 8px;
    align-items: center;
}
.project-row-date i {
    color: var(--primary);
}
.project-row-date span {
    color: #344054;
    font-weight: 850;
}
.project-row-date strong {
    grid-column: 2;
    color: var(--muted);
    font-weight: 700;
    font-size: 12px;
}
.team-project-board {
    padding: 22px;
}
.team-project-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
    margin-bottom: 14px;
}
.team-project-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}
.team-project-summary-item {
    min-height: 92px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    color: inherit;
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.team-project-summary-item:hover,
.team-project-summary-item.active {
    border-color: #b8ccff;
    background: linear-gradient(180deg, #f6f9ff 0%, #eef4ff 100%);
    color: inherit;
    box-shadow: 0 14px 32px rgba(37, 99, 235, .10);
    transform: translateY(-1px);
}
.team-project-summary-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    font-size: 19px;
}
.team-project-summary-icon-blue {
    background: #2563eb;
    color: #fff;
}
.team-project-summary-icon-amber {
    background: #ffc107;
    color: #111827;
}
.team-project-summary-icon-indigo {
    background: #2f6bff;
    color: #fff;
}
.team-project-summary-icon-green {
    background: #198754;
    color: #fff;
}
.team-project-summary-icon-red {
    background: #dc3545;
    color: #fff;
}
.team-project-summary-icon-slate {
    background: #6c757d;
    color: #fff;
}
.team-project-summary-copy {
    min-width: 0;
}
.team-project-summary-copy small {
    color: var(--muted);
    display: block;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.2;
}
.team-project-summary-copy strong {
    display: block;
    color: var(--ink);
    font-size: 28px;
    font-weight: 900;
    line-height: 1;
    margin-top: 4px;
}
.team-project-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 1.55fr) repeat(3, minmax(145px, .72fr)) auto auto;
    gap: 10px;
    margin-bottom: 16px;
}
.admin-project-summary {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.admin-project-toolbar {
    grid-template-columns: minmax(280px, 1.45fr) repeat(4, minmax(135px, .7fr)) auto auto;
}
.ym-project-filters.ym-admin-project-filters {
    align-items: stretch;
    grid-template-columns: minmax(260px, 1.35fr) repeat(4, minmax(118px, .55fr)) minmax(92px, auto) 44px;
    gap: 10px;
}
.ym-project-filters.ym-admin-project-filters .btn {
    min-height: 42px;
    white-space: nowrap;
}
.ym-project-filters.ym-admin-project-filters .btn-outline-secondary {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    padding-inline: 0;
}
.ym-project-row.ym-admin-project-row {
    grid-template-columns: minmax(270px, 1.35fr) minmax(185px, .78fr) minmax(132px, .48fr) minmax(112px, .36fr) minmax(132px, .44fr) auto;
    gap: 16px;
    padding: 16px 18px;
    transition: background .2s ease, box-shadow .2s ease;
}
.ym-project-row.ym-admin-project-row.ym-admin-project-row-grouped {
    grid-template-columns: minmax(300px, 1.35fr) minmax(132px, .48fr) minmax(112px, .36fr) minmax(132px, .44fr) auto;
    gap: 16px;
}
.ym-admin-project-owner {
    min-width: 0;
}
.ym-admin-project-owner .avatar {
    height: 38px;
    width: 38px;
}
.ym-admin-project-owner .avatar-img {
    object-fit: cover;
}
.ym-admin-project-actions form {
    margin: 0;
}
.ym-admin-project-actions .ym-project-row-open,
.ym-admin-project-delete {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    color: #64748b;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    padding: 0;
    width: 38px;
}
.ym-admin-project-actions .ym-project-row-open:hover {
    border-color: #bfdbfe;
    color: #085bcb;
}
.ym-admin-project-delete {
    border-color: #ffccd5;
    color: #dc3545;
}
.ym-admin-project-delete:hover {
    background: #fff5f7;
}
.ym-admin-owner-pill {
    align-items: center;
    background: #eef5ff;
    border: 1px solid #dbe8ff;
    border-radius: 999px;
    color: #085bcb;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    gap: 6px;
    padding: 5px 10px;
}
.ym-project-row.ym-admin-project-row .ym-project-row-icon {
    border-radius: 14px;
    height: 44px;
    width: 44px;
}
.ym-project-row.ym-admin-project-row .ym-project-row-main {
    gap: 12px;
}
.ym-project-row.ym-admin-project-row .ym-project-row-main h3 {
    font-size: 15px;
    margin-bottom: 3px;
}
.ym-project-row.ym-admin-project-row .ym-project-row-main p {
    display: -webkit-box;
    font-size: 13px;
    line-height: 1.35;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.ym-project-row.ym-admin-project-row .ym-project-row-main small {
    font-size: 12px;
    margin-top: 5px;
}
.ym-project-row.ym-admin-project-row .ym-project-row-date small,
.ym-project-row.ym-admin-project-row .ym-project-row-priority small,
.ym-project-row.ym-admin-project-row .ym-project-row-status small {
    font-size: 11px;
    margin-bottom: 3px;
}
.ym-project-row.ym-admin-project-row .ym-project-row-date strong {
    font-size: 13px;
}
.ym-admin-project-table-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.ym-admin-project-table-list .ym-project-row.ym-admin-project-row:hover {
    background: linear-gradient(135deg, #fbfcff, #fff);
    box-shadow: inset 3px 0 0 #2e6bfb;
}
.ym-admin-project-table-list .ym-project-row-main h3,
.ym-admin-project-table-list .ym-admin-project-owner strong,
.ym-admin-project-table-list .ym-project-row-date strong {
    color: #060a3d;
}
.ym-admin-project-table-list .ym-project-row-main p,
.ym-admin-project-table-list .ym-project-row-main small,
.ym-admin-project-table-list .ym-admin-project-owner small,
.ym-admin-project-table-list .ym-project-row-date small,
.ym-admin-project-table-list .ym-project-row-priority small,
.ym-admin-project-table-list .ym-project-row-status small {
    color: #64748b;
}
.ym-admin-project-table-list .ym-project-row-priority .badge,
.ym-admin-project-table-list .ym-project-row-status .badge {
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
    padding: 8px 12px;
    white-space: nowrap;
}
.ym-admin-project-table-list-grouped {
    border: 0;
    border-radius: 0;
}
.ym-completed-row.ym-admin-completed-row {
    grid-template-columns: 44px minmax(240px, 1fr) minmax(110px, .35fr) auto;
}
.team-project-table-wrap {
    border-top: 1px solid var(--line);
}
.team-project-table {
    min-width: 940px;
}
.team-project-table thead th {
    border-bottom: 1px solid var(--line);
    color: #111827;
    font-size: 13px;
    font-weight: 900;
    padding: 14px 12px;
    white-space: nowrap;
}
.team-project-table tbody td {
    border-bottom: 1px solid var(--line);
    padding: 16px 12px;
    vertical-align: middle;
}
.team-project-table tbody tr:hover {
    background: #fbfcff;
}
.team-project-title-cell {
    min-width: 360px;
}
.team-project-title-cell strong,
.team-project-title-cell span,
.team-project-title-cell small {
    display: block;
}
.team-project-title-cell strong {
    color: var(--ink);
    font-size: 15px;
    font-weight: 900;
    line-height: 1.35;
}
.team-project-title-cell span {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
    margin-top: 3px;
}
.team-project-title-cell small {
    color: #475569;
    font-size: 12px;
    line-height: 1.4;
    margin-top: 6px;
}
.team-project-title-cell small i {
    color: var(--primary);
    margin-right: 5px;
}
.team-project-date-cell strong,
.team-project-date-cell span {
    display: block;
    white-space: nowrap;
}
.team-project-date-cell strong {
    color: #111827;
    font-size: 14px;
    font-weight: 850;
}
.team-project-date-cell span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    margin-top: 3px;
}
.team-update-pill {
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 850;
    padding: 5px 9px;
    white-space: nowrap;
}
.team-update-pill.has-update {
    background: #ecfdf3;
    color: #027a48;
}
.team-update-pill.no-update {
    background: #f1f5f9;
    color: #64748b;
}
.team-project-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.team-icon-action {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: .18s ease;
}
.team-icon-action.neutral {
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    color: #111827;
}
.team-icon-action.primary {
    border: 1px solid var(--primary);
    background: #fff;
    color: var(--primary);
}
.ym-project-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 20px;
}
.ym-project-stat {
    border: 1px solid var(--line);
    border-radius: 16px;
    color: inherit;
    min-height: 96px;
    padding: 16px 18px;
    display: flex;
    align-items: center;
    gap: 14px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .045);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.ym-project-stat:hover {
    border-color: #bfdbfe;
    box-shadow: 0 18px 42px rgba(37, 99, 235, .11);
    color: inherit;
    transform: translateY(-2px);
}
.ym-project-stat-blue { background: linear-gradient(135deg, #eff6ff, #ffffff 70%); }
.ym-project-stat-amber { background: linear-gradient(135deg, #fffbeb, #ffffff 70%); }
.ym-project-stat-red { background: linear-gradient(135deg, #fef2f2, #ffffff 70%); }
.ym-project-stat-purple { background: linear-gradient(135deg, #f5f3ff, #ffffff 70%); }
.ym-project-stat-green { background: linear-gradient(135deg, #ecfdf3, #ffffff 70%); }
.ym-project-stat-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    font-size: 20px;
}
.ym-project-stat-blue .ym-project-stat-icon { background: #2e6bfb; color: #fff; }
.ym-project-stat-amber .ym-project-stat-icon { background: #fbbf24; color: #92400e; }
.ym-project-stat-red .ym-project-stat-icon { background: #dc3545; color: #fff; }
.ym-project-stat-purple .ym-project-stat-icon { background: #8b5cf6; color: #fff; }
.ym-project-stat-green .ym-project-stat-icon { background: #198754; color: #fff; }
.ym-project-stat small,
.ym-project-stat strong {
    display: block;
}
.ym-project-stat small {
    color: #111827;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.2;
}
.ym-project-stat strong {
    color: #060a3d;
    font-size: 28px;
    line-height: 1.05;
    margin-top: 4px;
}
.ym-project-focus-panel {
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    background:
        radial-gradient(circle at 93% 12%, rgba(46, 107, 251, .16), transparent 23%),
        linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
}
.ym-project-focus-panel::after {
    content: "\F449";
    font-family: "bootstrap-icons";
    position: absolute;
    right: 44px;
    top: 8px;
    color: rgba(46, 107, 251, .18);
    font-size: 110px;
    transform: rotate(-18deg);
    pointer-events: none;
}
.ym-project-focus-head {
    position: relative;
    z-index: 1;
    margin-bottom: 16px;
}
.ym-project-focus-head h2 {
    align-items: center;
    color: #060a3d;
    display: flex;
    font-size: 22px;
    gap: 10px;
    margin: 0 0 4px;
}
.ym-project-focus-head h2 i {
    color: #fbbf24;
}
.ym-project-focus-head p {
    color: var(--muted);
    margin: 0;
}
.ym-project-focus-card {
    background: #fff;
    border: 1px solid #dbe5ff;
    border-left: 4px solid #2e6bfb;
    border-radius: 16px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .07);
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 22px;
    align-items: center;
    padding: 22px 24px;
    position: relative;
    z-index: 1;
}
.ym-project-focus-copy h3 {
    color: #060a3d;
    font-size: 24px;
    margin: 0 0 7px;
}
.ym-project-focus-copy p {
    color: var(--muted);
    margin: 0;
}
.ym-project-focus-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
}
.ym-due {
    align-items: center;
    display: inline-flex;
    gap: 7px;
    font-size: 13px;
    font-weight: 750;
}
.ym-due-danger { color: #dc3545; }
.ym-due-warning { color: #b45309; }
.ym-due-success { color: #198754; }
.ym-due-muted { color: var(--muted); }
.ym-project-focus-progress {
    border-left: 1px solid var(--line);
    padding-left: 24px;
}
.ym-project-focus-progress strong {
    color: #060a3d;
    font-size: 14px;
}
.ym-project-list-panel,
.ym-project-waiting-panel,
.ym-project-completed-panel {
    margin-bottom: 20px;
}
.ym-project-list-panel {
    background: #fff;
}
.ym-project-waiting-panel {
    border-top: 4px solid #8b5cf6;
    background: linear-gradient(180deg, rgba(139, 92, 246, .035), #fff 72%);
}
.ym-project-completed-panel {
    border-top: 4px solid #198754;
    background: linear-gradient(180deg, rgba(25, 135, 84, .03), #fff 72%);
}
.ym-admin-project-collapse-panel.ym-project-completed-panel {
    border-top: 0;
    background: #fff;
}
.ym-project-filters {
    display: grid;
    grid-template-columns: minmax(260px, 1.3fr) repeat(3, minmax(160px, .6fr)) auto auto;
    gap: 12px;
    margin-bottom: 20px;
}
.ym-project-filter-panel {
    margin-bottom: 20px;
}
.ym-project-filter-panel .ym-project-filters {
    margin-bottom: 0;
}
.ym-project-collapse-panel {
    overflow: hidden;
}
.ym-project-collapse-summary {
    cursor: pointer;
    list-style: none;
    margin-bottom: 0;
    user-select: none;
}
.ym-project-collapse-summary::-webkit-details-marker {
    display: none;
}
.ym-project-collapse-summary::marker {
    content: "";
}
.ym-project-collapse-body {
    margin-top: 16px;
}
.ym-project-collapse-toggle {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: #475569;
    display: inline-flex;
    flex: 0 0 auto;
    height: 40px;
    justify-content: center;
    transition: transform .18s ease, color .18s ease, border-color .18s ease;
    width: 40px;
}
.ym-project-collapse-toggle i {
    transition: transform .18s ease;
}
.ym-project-collapse-panel[open] .ym-project-collapse-toggle i {
    transform: rotate(180deg);
}
.ym-project-collapse-summary:hover .ym-project-collapse-toggle {
    border-color: #cbd5e1;
    color: #060a3d;
}
.ym-project-completed-link {
    margin-bottom: 14px;
}
.ym-project-inline-section {
    border: 1px solid var(--line);
    border-radius: 16px;
    margin-top: 18px;
    overflow: hidden;
    padding: 22px;
}
.ym-project-inline-section:first-of-type {
    margin-top: 0;
}
.ym-project-inline-section .ym-project-section-head {
    margin-bottom: 14px;
}
.ym-project-inline-section .ym-project-collapse-summary {
    margin-bottom: 0;
}
.ym-project-inline-section-review {
    background: #fff;
    border-color: var(--line);
    box-shadow: none;
}
.ym-project-inline-section-active {
    background: #fff;
    border-color: var(--line);
    box-shadow: none;
}
.ym-project-section-head {
    align-items: flex-start;
    display: flex;
    margin-bottom: 14px;
}
.ym-project-section-title-inline {
    align-items: center;
    display: flex;
    gap: 14px;
    min-width: 0;
}
.ym-project-section-icon {
    border-radius: 14px;
    color: #fff;
    display: grid;
    flex: 0 0 auto;
    font-size: 22px;
    height: 48px;
    place-items: center;
    width: 48px;
}
.ym-project-section-icon-action {
    background: #eef4ff;
    color: #2e6bfb;
}
.ym-project-section-icon-review {
    background: #eef4ff;
    color: #2e6bfb;
}
.ym-project-section-icon-complete {
    background: #edf9f1;
    color: #16834f;
}
.ym-project-section-head h2 {
    color: #060a3d;
    font-size: 20px;
    margin: 0;
}
.ym-project-section-head p {
    color: var(--muted);
    margin: 4px 0 0;
}
.ym-project-section-head-between {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
}
.ym-project-section-head-review,
.ym-project-section-head-action {
    border-radius: 0;
    padding: 0;
}
.ym-project-section-head-review {
    background: transparent;
    border: 0;
}
.ym-project-section-head-action {
    background: transparent;
    border: 0;
}
.ym-admin-project-collapse-panel {
    background: #fff;
}
.ym-admin-project-collapse-panel .ym-project-section-head-complete {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
}
.ym-project-tabs {
    border-bottom: 1px solid var(--line);
    gap: 18px;
    margin-bottom: 0;
}
.ym-project-tabs .nav-link {
    border: 0;
    border-bottom: 3px solid transparent;
    color: #475569;
    font-weight: 750;
    padding: 10px 0 12px;
}
.ym-project-tabs .nav-link.active {
    background: transparent;
    border-color: #2e6bfb;
    color: #085bcb;
}
.ym-project-tab-content {
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 16px 16px;
    overflow: hidden;
}
.ym-project-card-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.ym-project-list-panel .ym-project-card-list {
    border-color: #cfe0ff;
}
.ym-project-section-head-review + .ym-project-card-list {
    border-color: #ddd6fe;
}
.ym-project-active-panel .ym-project-card-list,
.ym-project-section-head-action + .ym-project-card-list {
    border-color: #cfe0ff;
}
.ym-project-list-panel .ym-admin-project-table-list,
.ym-project-completed-panel .ym-admin-project-table-list {
    border-color: var(--line);
}
.ym-admin-project-member-groups {
    display: grid;
    gap: 14px;
    grid-template-columns: 1fr;
}
.ym-admin-project-member-group {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: none;
    overflow: hidden;
}
.ym-admin-project-member-head {
    align-items: center;
    background: #fbfcff;
    border: 0;
    border-bottom: 1px solid var(--line);
    cursor: pointer;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 14px 16px;
    text-align: left;
    transition: background .18s ease;
    width: 100%;
}
.ym-admin-project-member-head:hover {
    background: #f8fbff;
}
.ym-admin-project-member-person {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.ym-admin-project-member-person .avatar {
    border: 1px solid var(--line);
    height: 42px;
    width: 42px;
}
.ym-admin-project-member-person .avatar-img {
    object-fit: cover;
}
.ym-admin-project-member-person strong {
    color: #060a3d;
    display: block;
    font-size: 15px;
    line-height: 1.25;
}
.ym-admin-project-member-person small {
    color: var(--muted);
    display: block;
    font-size: 12px;
    margin-top: 2px;
}
.ym-admin-project-member-stats {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}
.ym-admin-project-member-stats span {
    background: #fff;
    border: 1px solid #e2eaf8;
    border-radius: 999px;
    color: #475569;
    font-size: 11px;
    line-height: 1;
    padding: 7px 9px;
    white-space: nowrap;
}
.ym-admin-project-member-stats strong {
    color: #060a3d;
    font-weight: 700;
}
.ym-admin-project-member-stats .ym-admin-project-member-stat-warning {
    background: #fff8e1;
    border-color: #fde68a;
    color: #92400e;
}
.ym-admin-project-member-stats .ym-admin-project-member-stat-danger {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #be123c;
}
.ym-admin-project-member-chevron {
    color: #2e6bfb;
    font-size: 16px;
    transition: transform .18s ease;
}
.ym-admin-project-member-head.collapsed .ym-admin-project-member-chevron {
    transform: rotate(180deg);
}
.ym-admin-member-project-list {
    border: 0;
    border-radius: 0;
}
.ym-admin-review-list {
    display: grid;
    gap: 10px;
}
.ym-admin-project-scroll-region {
    border-radius: 16px;
    margin-right: -4px;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
    scrollbar-color: rgba(46, 107, 251, .45) #eef4ff;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}
.ym-admin-project-review-scroll {
    max-height: clamp(230px, 34vh, 420px);
}
.ym-admin-project-active-scroll {
    max-height: clamp(420px, 56vh, 620px);
}
.ym-admin-scroll-eight {
    --admin-scroll-row-height: 92px;
    max-height: calc((var(--admin-scroll-row-height) * 8) + 70px);
}
.ym-admin-project-review-scroll.ym-admin-scroll-eight {
    --admin-scroll-row-height: 86px;
}
.ym-admin-project-active-scroll.ym-admin-scroll-eight {
    --admin-scroll-row-height: 96px;
}
.ym-admin-project-completed-scroll.ym-admin-scroll-eight {
    --admin-scroll-row-height: 92px;
}
.ym-admin-project-scroll-region::-webkit-scrollbar {
    width: 8px;
}
.ym-admin-project-scroll-region::-webkit-scrollbar-track {
    background: #eef4ff;
    border-radius: 999px;
}
.ym-admin-project-scroll-region::-webkit-scrollbar-thumb {
    background: rgba(46, 107, 251, .36);
    border-radius: 999px;
}
.ym-admin-project-scroll-region::-webkit-scrollbar-thumb:hover {
    background: rgba(46, 107, 251, .58);
}
@media (max-width: 991.98px) {
    .ym-admin-project-review-scroll {
        max-height: 360px;
    }

    .ym-admin-project-active-scroll {
        max-height: 560px;
    }
}
.ym-admin-review-item {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(260px, .8fr) auto;
    gap: 18px;
    padding: 14px 16px;
}
.ym-admin-review-project {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.ym-admin-review-project h3,
.ym-admin-compact-project h3 {
    color: #060a3d;
    font-size: 15px;
    line-height: 1.25;
    margin: 0;
}
.ym-admin-review-project p,
.ym-admin-compact-project p {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
    margin: 4px 0 0;
}
.ym-admin-review-meta {
    display: grid;
    grid-template-columns: minmax(130px, 1fr) minmax(100px, auto);
    gap: 16px;
}
.ym-admin-review-meta small {
    color: var(--muted);
    display: block;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 3px;
}
.ym-admin-review-meta strong {
    color: #060a3d;
    display: block;
    font-size: 13px;
    line-height: 1.25;
}
.ym-admin-review-meta em {
    display: block;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    margin-top: 2px;
}
.ym-admin-compact-project-list {
    display: grid;
    gap: 0;
    padding: 0;
}
.ym-admin-compact-project {
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #e7edf8;
    border-radius: 0;
    display: grid;
    grid-template-columns: minmax(360px, 1.35fr) minmax(140px, .45fr) minmax(190px, .55fr) auto;
    gap: 18px;
    padding: 18px 20px;
    transition: background .18s ease;
}
.ym-admin-compact-project:last-child {
    border-bottom: 0;
}
.ym-admin-compact-project:hover {
    background: #fbfdff;
}
.ym-admin-compact-project-main {
    align-items: center;
    display: flex;
    gap: 14px;
    min-width: 0;
}
.ym-admin-compact-project-main .ym-project-row-icon {
    height: 52px;
    width: 52px;
    font-size: 22px;
    flex: 0 0 auto;
}
.ym-admin-compact-project-main small {
    align-items: center;
    color: #475569;
    display: flex;
    font-size: 12px;
    gap: 6px;
    line-height: 1.35;
    margin-top: 8px;
}
.ym-admin-compact-project-main small i {
    color: #2e6bfb;
}
.ym-admin-compact-project-tags {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    grid-column: auto;
    justify-content: flex-start;
}
.ym-admin-compact-project-tags small,
.ym-admin-compact-project-due small {
    color: #64748b;
    display: block;
    flex-basis: 100%;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 2px;
}
.ym-admin-compact-project-due strong {
    color: #060a3d;
    display: block;
    font-size: 14px;
    line-height: 1.25;
}
.ym-admin-compact-project-due em {
    display: block;
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    margin-top: 3px;
}
.ym-admin-compact-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    grid-column: auto;
    grid-row: auto;
    justify-content: flex-end;
}
.ym-project-waiting-panel .ym-project-card-list {
    border-color: #ddd6fe;
}
.ym-project-completed-panel .ym-completed-list {
    border-color: var(--line);
}
.ym-project-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: grid;
    grid-template-columns: minmax(320px, 1.65fr) minmax(140px, .55fr) minmax(110px, .4fr) minmax(140px, .5fr) auto;
    gap: 18px;
    padding: 18px;
}
.ym-project-row.ym-admin-project-row:not(.ym-admin-project-row-grouped) {
    grid-template-columns: minmax(300px, 1.35fr) minmax(210px, .8fr) minmax(140px, .5fr) minmax(110px, .35fr) minmax(140px, .45fr) auto;
}
.ym-project-row:last-child {
    border-bottom: 0;
}
.ym-project-row:hover {
    background: #fbfcff;
}
.ym-project-row-main {
    align-items: flex-start;
    display: flex;
    gap: 14px;
    min-width: 0;
}
.ym-project-row-icon {
    border-radius: 12px;
    display: inline-grid;
    flex: 0 0 auto;
    font-size: 20px;
    height: 44px;
    place-items: center;
    width: 44px;
}
.ym-project-row-icon-blue { background: #e9efff; color: #2e6bfb; }
.ym-project-row-icon-green { background: #dcfce7; color: #198754; }
.ym-project-row-icon-amber { background: #fff4d6; color: #b45309; }
.ym-project-row-icon-red { background: #fee2e2; color: #dc3545; }
.ym-project-row-icon-indigo { background: #eef2ff; color: #2e6bfb; }
.ym-project-row-main h3,
.ym-completed-row h3 {
    color: #060a3d;
    font-size: 16px;
    line-height: 1.3;
    margin: 0 0 5px;
}
.ym-project-row-main p,
.ym-completed-row p {
    color: var(--muted);
    line-height: 1.4;
    margin: 0;
}
.ym-project-row-main small {
    color: #475569;
    display: block;
    font-size: 12px;
    line-height: 1.4;
    margin-top: 7px;
}
.ym-project-row-main small i {
    color: #2e6bfb;
    margin-right: 6px;
}
.ym-project-row-date small,
.ym-project-row-priority small,
.ym-project-row-status small,
.ym-completed-meta small {
    color: var(--muted);
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 5px;
}
.ym-project-row-date strong {
    color: #060a3d;
    display: block;
    font-size: 14px;
    margin-bottom: 2px;
}
.ym-project-row-action {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}
.ym-project-row-open {
    color: #64748b;
    display: inline-flex;
    font-size: 18px;
}
.ym-completed-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.ym-completed-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: grid;
    grid-template-columns: 44px minmax(240px, 1fr) minmax(110px, .35fr) auto;
    gap: 16px;
    padding: 18px;
}
.ym-completed-row:last-child {
    border-bottom: 0;
}
.ym-completed-meta {
    justify-self: start;
}
.ym-project-detail-summary {
    align-items: flex-start;
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-bottom: 20px;
}
.ym-project-detail-title {
    align-items: center;
    display: flex;
    gap: 16px;
    min-width: 0;
}
.ym-project-detail-icon {
    border-radius: 16px;
    display: grid;
    flex: 0 0 auto;
    font-size: 24px;
    height: 56px;
    place-items: center;
    width: 56px;
}
.ym-project-detail-title h2 {
    color: #060a3d;
    font-size: 24px;
    line-height: 1.2;
    margin: 0 0 6px;
}
.ym-project-detail-title p {
    color: var(--muted);
    margin: 0;
}
.ym-project-detail-actions {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
}
.ym-project-detail-metrics {
    display: grid;
    gap: 14px;
    grid-column: 1 / -1;
    grid-template-columns: minmax(160px, .7fr) minmax(160px, .7fr) minmax(180px, .8fr) minmax(260px, 1.2fr);
}
.ym-project-detail-metric {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    display: flex;
    gap: 14px;
    min-height: 76px;
    padding: 15px 18px;
}
.ym-project-detail-metric i {
    color: #2e6bfb;
    font-size: 22px;
}
.ym-project-detail-metric small,
.ym-project-detail-progress small {
    color: var(--muted);
    display: block;
    font-size: 13px;
    line-height: 1.25;
    margin-bottom: 3px;
}
.ym-project-detail-metric strong {
    color: #060a3d;
    display: block;
    font-size: 17px;
}
.ym-project-detail-priority {
    background: linear-gradient(135deg, #fff7ed, #fff);
}
.ym-project-detail-priority i {
    color: #dc3545;
}
.ym-project-detail-status {
    background: linear-gradient(135deg, #ecfdf3, #fff);
}
.ym-project-detail-status i {
    color: #198754;
}
.ym-project-detail-progress {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    min-height: 76px;
    padding: 15px 18px;
}
.ym-project-detail-progress strong {
    color: #060a3d;
    font-size: 28px;
    line-height: 1;
}
.ym-project-detail-panel {
    margin-bottom: 20px;
}
.ym-project-detail-section-head {
    align-items: center;
    display: flex;
    gap: 14px;
    margin-bottom: 16px;
}
.ym-project-detail-section-icon {
    border-radius: 12px;
    display: grid;
    flex: 0 0 auto;
    font-size: 20px;
    height: 42px;
    place-items: center;
    width: 42px;
}
.ym-project-detail-section-head h2 {
    color: #060a3d;
    font-size: 20px;
    margin: 0;
}
.ym-project-detail-section-head p {
    color: var(--muted);
    margin: 3px 0 0;
}
.ym-project-overview-grid {
    border: 1px solid var(--line);
    border-radius: 16px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
}
.ym-project-overview-grid > div {
    padding: 22px;
}
.ym-project-overview-grid > div + div {
    border-left: 1px solid var(--line);
}
.ym-project-overview-grid h3 {
    color: #060a3d;
    font-size: 14px;
    margin: 0 0 12px;
}
.ym-project-overview-grid p {
    color: #334155;
    line-height: 1.65;
    margin: 0;
}
.ym-project-update-form textarea {
    border-radius: 14px;
    min-height: 132px;
    resize: vertical;
}
.ym-project-update-actions {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-top: 16px;
}
.ym-project-attachments {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.ym-project-attachments span {
    color: var(--muted);
    font-size: 14px;
}
.ym-project-locked-state {
    align-items: flex-start;
    background: linear-gradient(135deg, #ecfdf3, #fff);
    border: 1px solid #bbf7d0;
    border-radius: 16px;
    display: flex;
    gap: 14px;
    padding: 18px;
}
.ym-project-locked-state-review {
    background: linear-gradient(135deg, #eff6ff, #fff);
    border-color: #cfe0ff;
}
.ym-project-locked-state i {
    color: #198754;
    font-size: 24px;
}
.ym-project-locked-state-review i {
    color: #2e6bfb;
}
.ym-project-locked-state strong {
    color: #060a3d;
    display: block;
    margin-bottom: 4px;
}
.ym-project-locked-state p {
    color: var(--muted);
    margin: 0;
}
.ym-project-activity-list {
    position: relative;
}
.ym-project-activity-item {
    align-items: flex-start;
    display: grid;
    gap: 16px;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    padding: 16px 0;
    position: relative;
}
.ym-project-activity-item:not(:last-child) {
    border-bottom: 1px solid var(--line);
}
.ym-project-activity-icon {
    border-radius: 50%;
    display: grid;
    font-size: 18px;
    height: 40px;
    place-items: center;
    position: relative;
    width: 40px;
}
.ym-project-activity-blue {
    background: #e9efff;
    color: #2e6bfb;
}
.ym-project-activity-green {
    background: #dcfce7;
    color: #198754;
}
.ym-project-activity-item strong {
    color: #060a3d;
    display: block;
    font-size: 15px;
    margin-bottom: 3px;
}
.ym-project-activity-item p {
    color: var(--muted);
    line-height: 1.45;
    margin: 0;
}
.ym-project-activity-item time {
    color: #475569;
    font-size: 13px;
    min-width: 150px;
    text-align: right;
}
.ym-project-activity-item time span {
    color: var(--muted);
    display: block;
    margin-top: 2px;
}
.project-detail-card {
    margin-bottom: 18px;
    padding: 28px 34px;
}
.project-detail-section-summary,
.project-detail-section-details,
.project-detail-section-activity {
    overflow: hidden;
}
.project-detail-section-summary {
    background: linear-gradient(180deg, rgba(245, 158, 11, .045), #fff 72%);
    border-top: 4px solid #f59e0b;
}
.project-detail-section-details {
    background: linear-gradient(180deg, rgba(46, 107, 251, .035), #fff 72%);
    border-top: 4px solid #2e6bfb;
}
.project-detail-section-activity {
    background: linear-gradient(180deg, rgba(22, 163, 74, .035), #fff 72%);
    border-top: 4px solid #16a34a;
}
.project-detail-summary-card {
    padding-top: 30px;
}
.project-detail-summary-top {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding-bottom: 24px;
}
.project-detail-title-lockup {
    align-items: center;
    display: flex;
    gap: 18px;
    min-width: 0;
}
.project-detail-main-icon {
    background: linear-gradient(135deg, #fff7d6, #fff);
    border-radius: 18px;
    color: #d99a00;
    display: grid;
    flex: 0 0 auto;
    font-size: 30px;
    height: 76px;
    place-items: center;
    width: 76px;
}
.project-detail-title-lockup h2 {
    color: #060a3d;
    font-size: 30px;
    line-height: 1.15;
    margin: 0 0 8px;
}
.project-detail-title-lockup p {
    color: #475569;
    font-size: 15px;
    margin: 0;
}
.project-detail-metric-row {
    display: grid;
    gap: 0;
    grid-template-columns: .85fr 1.3fr 1.2fr 1.25fr;
    padding-top: 26px;
}
.project-detail-metric-block,
.project-detail-progress-block {
    align-items: center;
    border-right: 1px solid var(--line);
    display: flex;
    gap: 16px;
    min-height: 78px;
    padding: 0 28px 0 12px;
}
.project-detail-progress-block {
    border-right: 0;
    display: block;
    padding-right: 0;
}
.project-detail-metric-block span {
    border-radius: 50%;
    display: grid;
    flex: 0 0 auto;
    font-size: 22px;
    height: 48px;
    place-items: center;
    width: 48px;
}
.project-detail-priority-block span {
    background: #fff1f2;
    color: #dc3545;
}
.project-detail-status-block span {
    background: #dcfce7;
    color: #198754;
}
.project-detail-due-block span {
    background: #e9efff;
    color: #2e6bfb;
}
.project-detail-metric-block small,
.project-detail-progress-block small,
.project-detail-info-row small {
    color: #64748b;
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
}
.project-detail-metric-block strong {
    color: #060a3d;
    display: block;
    font-size: 17px;
    line-height: 1.25;
}
.project-detail-priority-block strong {
    color: #dc3545;
}
.project-detail-status-block strong {
    color: #16834d;
}
.project-detail-due-block em {
    color: #64748b;
    display: block;
    font-size: 14px;
    font-style: normal;
    margin-top: 4px;
}
.project-detail-progress-block > div {
    align-items: center;
    display: grid;
    gap: 16px;
    grid-template-columns: auto 1fr;
}
.project-detail-progress-block strong {
    color: #060a3d;
    font-size: 28px;
    line-height: 1;
}
.project-detail-card-title {
    color: #060a3d;
    font-size: 24px;
    line-height: 1.2;
    margin: 0;
}
.project-detail-info-row {
    border-top: 1px solid var(--line);
    padding: 26px 10px;
}
.project-detail-info-row:first-of-type {
    margin-top: 26px;
}
.project-detail-info-row:last-child {
    padding-bottom: 0;
}
.project-detail-info-row p {
    color: #111827;
    font-size: 16px;
    line-height: 1.6;
    margin: 0;
}
.project-detail-state-note {
    align-items: center;
    background: #f4f8ff;
    border: 1px solid #dbe8ff;
    border-radius: 14px;
    display: flex;
    gap: 16px;
    padding: 18px 22px;
}
.project-detail-state-note span,
.project-detail-review-box span {
    border-radius: 50%;
    display: grid;
    flex: 0 0 auto;
    font-size: 22px;
    height: 48px;
    place-items: center;
    width: 48px;
}
.project-detail-state-review span {
    background: #e9efff;
    color: #2e6bfb;
}
.project-detail-state-refinement {
    background: #fff7ed;
    border-color: #fed7aa;
}
.project-detail-state-refinement span {
    background: #ffedd5;
    color: #ea580c;
}
.project-detail-state-complete span,
.project-detail-review-box span {
    background: #dcfce7;
    color: #198754;
}
.project-detail-state-note strong,
.project-detail-review-box strong {
    color: #060a3d;
    display: block;
    font-size: 17px;
    margin-bottom: 4px;
}
.project-detail-state-note p,
.project-detail-review-box p {
    color: #64748b;
    margin: 0;
}
.project-detail-review-box {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    display: grid;
    gap: 16px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    margin-top: 26px;
    padding: 20px;
}
.project-detail-review-box em {
    background: #dcfce7;
    border-radius: 999px;
    color: #16834d;
    font-size: 13px;
    font-style: normal;
    font-weight: 700;
    padding: 6px 12px;
}
.project-detail-simple-form textarea {
    border-radius: 14px;
    min-height: 118px;
    resize: vertical;
}
.project-detail-simple-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 14px;
}
.project-detail-activity-head {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 18px;
}
.project-detail-activity-card .ym-project-activity-list {
    padding-top: 4px;
}
.project-detail-activity-card .ym-project-activity-item {
    padding-left: 8px;
    padding-right: 8px;
}
.project-detail-status-form {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(220px, .5fr) auto;
    max-width: 620px;
}
.project-status-quality-fields {
    background: #fbfdff;
    border: 1px solid var(--line);
    border-radius: 14px;
    grid-column: 1 / -1;
    padding: 14px;
}
.project-detail-admin-actions {
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(220px, .35fr) minmax(320px, .65fr);
}
.project-detail-admin-actions form {
    display: grid;
    gap: 10px;
}
.project-detail-completion-review-actions {
    align-items: stretch;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: none;
}
.project-detail-completion-review-actions form {
    background: #ffffff;
    border: 1px solid var(--line);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 100%;
    padding: 12px;
}
.project-detail-completion-review-actions form .btn {
    margin-top: auto;
    width: 100%;
}
.admin-completion-decision {
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 14px;
    display: flex;
    gap: 12px;
    padding: 14px;
}
.admin-completion-decision span {
    border-radius: 14px;
    display: grid;
    flex: 0 0 44px;
    font-size: 20px;
    height: 44px;
    place-items: center;
    width: 44px;
}
.admin-completion-decision strong {
    color: #060a3d;
    display: block;
    font-size: 15px;
    font-weight: 650;
}
.admin-completion-decision p {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.4;
    margin: 3px 0 0;
}
.admin-completion-decision-approve span {
    background: #dcfce7;
    color: #198754;
}
.admin-completion-decision-reject span {
    background: #fff7ed;
    color: #ea580c;
}
.project-quality-approval-box {
    background: #fbfdff;
    border: 1px solid var(--line);
    border-radius: 14px;
    flex: 1;
    padding: 14px;
}
.quality-rating-picker {
    display: inline-flex;
    flex-direction: row-reverse;
    gap: 4px;
    justify-content: flex-end;
}
.quality-rating-picker input {
    height: 1px;
    opacity: 0;
    position: absolute;
    width: 1px;
}
.quality-rating-picker label {
    color: #d7deea;
    cursor: pointer;
    font-size: 28px;
    line-height: 1;
    transition: color .2s ease, transform .2s ease;
}
.quality-rating-picker label:hover,
.quality-rating-picker label:hover ~ label,
.quality-rating-picker input:checked ~ label {
    color: #f5b301;
}
.quality-rating-picker label:hover {
    transform: translateY(-1px);
}
.project-quality-review-card {
    align-items: center;
    background: #fbfdff;
    border: 1px solid var(--line);
    border-radius: 14px;
    display: grid;
    gap: 12px 18px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 18px 20px;
}
.project-quality-review-card strong {
    color: #060a3d;
    display: block;
    font-size: 17px;
    font-weight: 650;
    margin-bottom: 4px;
}
.project-quality-review-card p {
    color: var(--muted);
    font-size: 14px;
    margin: 0;
}
.project-quality-stars {
    color: #f5b301;
    display: inline-flex;
    font-size: 22px;
    gap: 3px;
    white-space: nowrap;
}
.project-quality-feedback {
    background: #f4f8ff;
    border-radius: 12px;
    grid-column: 1 / -1;
    padding: 12px 14px;
}
@media (max-width: 575.98px) {
    .project-quality-review-card {
        grid-template-columns: 1fr;
    }
}
.project-upload-box {
    background: #f8fbff;
    border: 1px solid var(--line);
    border-radius: 14px;
    margin-top: 12px;
    padding: 14px;
}
.project-upload-box p {
    color: var(--muted);
    font-size: 13px;
    margin: 8px 0 0;
}
.project-attachment-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.project-attachment-pill {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe8ff;
    border-radius: 999px;
    color: #0f172a;
    display: inline-flex;
    font-size: 13px;
    gap: 8px;
    max-width: 100%;
    padding: 8px 12px;
    text-decoration: none;
}
.project-attachment-pill:hover {
    background: #eef5ff;
    color: #085bcb;
}
.project-attachment-pill i {
    color: #2e6bfb;
}
.project-attachment-pill span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.project-attachment-pill em {
    color: var(--muted);
    font-style: normal;
    white-space: nowrap;
}
.project-update-history {
    display: grid;
    gap: 12px;
}
.project-update-item {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 16px;
}
.project-update-item-head {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 10px;
}
.project-update-item-head strong {
    color: #060a3d;
    display: block;
    font-size: 15px;
    font-weight: 650;
}
.project-update-item-head p {
    color: var(--muted);
    font-size: 13px;
    margin: 3px 0 0;
}
.project-update-item-head span {
    background: #eef5ff;
    border-radius: 999px;
    color: #085bcb;
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 650;
    padding: 5px 10px;
}
.project-update-copy {
    color: #334155;
    font-size: 14px;
    line-height: 1.55;
    margin: 0 0 12px;
}
.admin-project-review-box {
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
}
.admin-project-review-head {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 12px;
}
.admin-project-review-head strong {
    color: #060a3d;
    display: block;
    font-size: 15px;
    font-weight: 650;
}
.admin-project-review-head p {
    color: var(--muted);
    font-size: 13px;
    margin: 4px 0 0;
}
.admin-orientation-review-list {
    display: grid;
    gap: 12px;
    margin-top: 16px;
}
.admin-orientation-review-list section {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px;
}
.admin-orientation-review-list h3 {
    color: #060a3d;
    font-size: 14px;
    font-weight: 650;
    margin: 0 0 10px;
}
.admin-orientation-review-list section > div {
    align-items: flex-start;
    display: flex;
    gap: 9px;
    padding: 7px 0;
}
.admin-orientation-review-list section > div + div {
    border-top: 1px solid var(--line);
}
.admin-orientation-review-list span {
    color: #334155;
    font-size: 13px;
    line-height: 1.4;
}

/* Compact project detail screens */
.project-detail-card {
    margin-bottom: 12px;
    padding: 18px 22px;
}
.project-detail-summary-card {
    padding-top: 18px;
}
.project-detail-summary-top {
    gap: 12px;
    padding-bottom: 14px;
}
.project-detail-title-lockup {
    gap: 12px;
}
.project-detail-main-icon {
    border-radius: 16px;
    font-size: 24px;
    height: 58px;
    width: 58px;
}
.project-detail-title-lockup h2 {
    font-size: 24px;
    margin-bottom: 4px;
}
.project-detail-title-lockup p {
    font-size: 13px;
}
.project-detail-metric-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding-top: 14px;
}
.project-detail-metric-block,
.project-detail-progress-block {
    gap: 10px;
    min-height: 54px;
    padding: 0 16px 0 8px;
}
.project-detail-metric-block span {
    font-size: 17px;
    height: 36px;
    width: 36px;
}
.project-detail-metric-block small,
.project-detail-progress-block small,
.project-detail-info-row small {
    font-size: 12px;
    margin-bottom: 3px;
}
.project-detail-metric-block strong {
    font-size: 15px;
}
.project-detail-due-block em {
    font-size: 12px;
    margin-top: 2px;
}
.project-detail-progress-block > div {
    gap: 10px;
}
.project-detail-progress-block strong {
    font-size: 22px;
}
.project-detail-card-title {
    font-size: 20px;
}
.project-detail-info-row {
    padding: 14px 4px;
}
.project-detail-info-row:first-of-type {
    margin-top: 14px;
}
.project-detail-info-row p {
    font-size: 14px;
    line-height: 1.45;
}
.project-detail-state-note {
    gap: 12px;
    padding: 12px 14px;
}
.project-detail-state-note span,
.project-detail-review-box span {
    font-size: 18px;
    height: 38px;
    width: 38px;
}
.project-detail-state-note strong,
.project-detail-review-box strong {
    font-size: 15px;
    margin-bottom: 2px;
}
.project-detail-review-box {
    gap: 12px;
    margin-top: 12px;
    padding: 12px 14px;
}
.project-detail-review-box em {
    font-size: 12px;
    padding: 5px 10px;
}
.project-detail-simple-form textarea {
    min-height: 82px;
}
.project-detail-simple-actions {
    margin-top: 10px;
}
.project-upload-box {
    margin-top: 10px;
    padding: 10px 12px;
}
.project-upload-box p {
    font-size: 12px;
    margin-top: 6px;
}
.project-attachment-list {
    gap: 8px;
}
.project-attachment-pill {
    padding: 6px 10px;
}
.project-history-disclosure {
    border-top: 1px solid var(--line);
    margin-top: 2px;
    padding-top: 12px;
}
.project-history-disclosure summary {
    align-items: center;
    color: #060a3d;
    cursor: pointer;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    gap: 10px;
    justify-content: space-between;
    list-style: none;
}
.project-history-disclosure summary::-webkit-details-marker {
    display: none;
}
.project-history-disclosure summary span {
    margin-right: auto;
}
.project-history-disclosure summary em {
    background: #eef5ff;
    border-radius: 999px;
    color: #085bcb;
    font-size: 12px;
    font-style: normal;
    font-weight: 650;
    padding: 4px 10px;
}
.project-history-disclosure summary i {
    color: #64748b;
    transition: transform .2s ease;
}
.project-history-disclosure[open] summary i {
    transform: rotate(180deg);
}
.project-history-disclosure .project-update-history {
    gap: 8px;
    margin-top: 10px;
}
.project-update-item {
    border-radius: 14px;
    padding: 10px 12px;
}
.project-update-item-head {
    margin-bottom: 6px;
}
.project-update-item-head strong {
    font-size: 14px;
}
.project-update-item-head p {
    font-size: 12px;
}
.project-update-item-head span {
    font-size: 11px;
    padding: 4px 8px;
}
.project-update-copy {
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 8px;
}
.project-detail-activity-head {
    margin-bottom: 10px;
}
.project-detail-activity-card .ym-project-activity-item {
    padding-bottom: 10px;
    padding-top: 10px;
}
.admin-project-review-box,
.project-quality-approval-box,
.project-status-quality-fields,
.admin-completion-decision {
    padding: 10px 12px;
}
.project-detail-admin-actions {
    gap: 10px;
}
.project-detail-admin-actions form {
    gap: 8px;
}
.quality-rating-picker label {
    font-size: 24px;
}

@media (max-width: 991.98px) {
    .project-detail-metric-row {
        gap: 10px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .project-detail-metric-block,
    .project-detail-progress-block {
        border: 1px solid var(--line);
        border-radius: 14px;
        padding: 10px 12px;
    }
    .project-detail-admin-actions,
    .project-detail-status-form {
        grid-template-columns: 1fr;
        max-width: none;
    }
}

@media (max-width: 575.98px) {
    .project-detail-card {
        padding: 16px;
    }
    .project-detail-summary-top,
    .project-detail-title-lockup,
    .project-detail-simple-actions,
    .project-detail-review-box {
        align-items: stretch;
        flex-direction: column;
    }
    .project-detail-review-box {
        grid-template-columns: 1fr;
    }
    .project-detail-metric-row {
        grid-template-columns: 1fr;
    }
}
.performance-section {
    margin-bottom: 18px;
    overflow: hidden;
    padding: 28px 34px;
}
.performance-section-summary {
    background: #fff;
    padding: 16px;
}
.performance-section-feedback {
    background: linear-gradient(180deg, rgba(139, 92, 246, .035), #fff 72%);
    border-top: 4px solid #8b5cf6;
}
.performance-section-previous {
    background: linear-gradient(180deg, rgba(46, 107, 251, .032), #fff 72%);
    border-top: 4px solid #2e6bfb;
}
.performance-section-head {
    align-items: center;
    display: flex;
    gap: 16px;
    margin-bottom: 26px;
}
.performance-section-head-between {
    justify-content: space-between;
}
.performance-section-title-inline {
    align-items: center;
    display: flex;
    gap: 16px;
    min-width: 0;
}
.performance-section-icon {
    border-radius: 12px;
    display: grid;
    flex: 0 0 auto;
    font-size: 22px;
    height: 48px;
    place-items: center;
    width: 48px;
}
.performance-icon-summary {
    background: #dcfce7;
    color: #16a34a;
}
.performance-icon-feedback {
    background: #ede9fe;
    color: #8b5cf6;
}
.performance-icon-previous {
    background: #e9efff;
    color: #2e6bfb;
}
.performance-section-head h2 {
    color: #060a3d;
    font-size: 22px;
    line-height: 1.2;
    margin: 0;
}
.performance-section-head p {
    color: #526174;
    margin: 5px 0 0;
}
.performance-summary-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.performance-summary-item {
    align-items: center;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    display: flex;
    gap: 12px;
    min-height: 86px;
    padding: 14px 16px;
}
.performance-summary-icon {
    border-radius: 12px;
    display: grid;
    flex: 0 0 auto;
    font-size: 20px;
    height: 44px;
    place-items: center;
    width: 44px;
}
.performance-summary-purple {
    background: #ede9fe;
    color: #7c3aed;
}
.performance-summary-amber {
    background: #ffedd5;
    color: #f97316;
}
.performance-summary-blue {
    background: #e9efff;
    color: #2e6bfb;
}
.performance-summary-item small,
.performance-average-card small {
    color: #526174;
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 6px;
}
.performance-summary-item strong,
.performance-average-card strong {
    color: #060a3d;
    display: block;
    font-size: 26px;
    line-height: 1.05;
    margin-bottom: 0;
}
.performance-summary-item strong em,
.performance-average-card strong em,
.performance-review-score strong em {
    color: #060a3d;
    font-size: .62em;
    font-style: normal;
    font-weight: 600;
}
.performance-summary-item p {
    color: #475569;
    font-size: 13px;
    margin: 0 0 8px;
}
.performance-summary-item p:last-child {
    margin-bottom: 0;
}
.performance-average-card {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    grid-column: span 2;
    min-height: 86px;
    padding: 14px 16px;
}
.performance-average-card > div:first-child > span {
    background: #dcfce7;
    border-radius: 999px;
    color: #16834d;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 12px;
}
.performance-average-card .summary-meter span,
.performance-encouragement span {
    background: #16a34a;
}
.performance-scale {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
}
.performance-scale small {
    color: #475569;
    margin: 0;
}
.performance-review-meta {
    align-items: center;
    display: flex;
    gap: 22px;
    white-space: nowrap;
}
.performance-review-meta span {
    background: #e9efff;
    border-radius: 10px;
    color: #085bcb;
    font-size: 13px;
    font-weight: 700;
    padding: 8px 13px;
}
.performance-review-meta strong {
    color: #334155;
    font-size: 14px;
}
.performance-latest-grid {
    align-items: center;
    display: grid;
    gap: 36px;
    grid-template-columns: minmax(260px, .55fr) minmax(0, 1fr);
    margin-bottom: 28px;
}
.performance-score-box {
    background: linear-gradient(135deg, #f8fbff, #fff);
    border: 1px solid #dbe5ff;
    border-radius: 16px;
    display: grid;
    gap: 22px;
    grid-template-columns: 1fr 1fr;
    padding: 24px;
}
.performance-score-box > div + div {
    border-left: 1px solid var(--line);
    padding-left: 22px;
}
.performance-score-box small {
    color: #526174;
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 8px;
}
.performance-score-box strong {
    color: #2e6bfb;
    display: block;
    font-size: 32px;
    line-height: 1;
}
.performance-score-box strong em {
    color: #2e6bfb;
    font-size: .55em;
    font-style: normal;
}
.performance-feedback-copy {
    align-items: flex-start;
    display: flex;
    gap: 20px;
}
.performance-feedback-copy > i {
    color: #a78bfa;
    font-size: 42px;
    line-height: 1;
}
.performance-feedback-copy strong {
    color: #060a3d;
    display: block;
    margin-bottom: 12px;
}
.performance-feedback-copy p {
    color: #334155;
    line-height: 1.75;
    margin: 0;
}
.performance-feedback-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.performance-feedback-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 22px;
}
.performance-feedback-card h3 {
    align-items: center;
    color: #060a3d;
    display: flex;
    font-size: 17px;
    gap: 12px;
    margin: 0 0 18px;
}
.performance-feedback-card h3 span {
    border-radius: 10px;
    display: grid;
    height: 38px;
    place-items: center;
    width: 38px;
}
.performance-card-strength h3 span {
    background: #dcfce7;
    color: #16a34a;
}
.performance-card-improvement h3 span {
    background: #ffedd5;
    color: #f97316;
}
.performance-card-action h3 span {
    background: #ede9fe;
    color: #7c3aed;
}
.performance-feedback-card p {
    align-items: center;
    color: #475569;
    display: flex;
    gap: 12px;
    margin: 0 0 14px;
}
.performance-feedback-card p:last-child {
    margin-bottom: 0;
}
.performance-card-strength p i {
    color: #16a34a;
}
.performance-card-improvement p i {
    color: #f97316;
}
.performance-card-action p i {
    color: #7c3aed;
}
.performance-review-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.performance-review-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    color: inherit;
    display: grid;
    gap: 18px;
    grid-template-columns: 48px minmax(260px, 1fr) minmax(170px, .5fr) minmax(120px, .35fr) auto;
    padding: 16px 20px;
}
.performance-review-row:last-child {
    border-bottom: 0;
}
.performance-review-row:hover {
    background: #fbfcff;
    color: inherit;
}
.performance-review-icon {
    background: #ede9fe;
    border-radius: 10px;
    color: #7c3aed;
    display: grid;
    font-size: 20px;
    height: 40px;
    place-items: center;
    width: 40px;
}
.performance-review-row strong,
.performance-review-row small {
    display: block;
}
.performance-review-row strong {
    color: #060a3d;
    font-size: 15px;
}
.performance-review-row small,
.performance-review-row time {
    color: #64748b;
}
.performance-review-score {
    align-items: center;
    display: flex;
    gap: 12px;
}
.performance-review-score strong {
    font-size: 22px;
}
.performance-empty-line {
    background: #fff;
    border: 1px dashed #dbe5ff;
    border-radius: 14px;
    color: #64748b;
    padding: 20px;
}
.performance-encouragement {
    align-items: center;
    background: linear-gradient(135deg, #ecfdf3, #fff);
    border: 1px solid #bbf7d0;
    border-radius: 16px;
    display: flex;
    gap: 18px;
    margin-top: 22px;
    padding: 20px 22px;
}
.performance-encouragement span {
    border-radius: 12px;
    color: #fff;
    display: grid;
    flex: 0 0 auto;
    font-size: 24px;
    height: 48px;
    place-items: center;
    width: 48px;
}
.performance-encouragement strong {
    color: #060a3d;
    display: block;
    margin-bottom: 5px;
}
.performance-encouragement p {
    color: #475569;
    margin: 0;
}
.admin-performance-summary-grid {
    margin-bottom: 18px;
}
.admin-performance-board {
    padding: 22px;
}
.admin-performance-toolbar {
    grid-template-columns: minmax(260px, 1.25fr) repeat(4, minmax(135px, .6fr)) auto auto;
    margin-bottom: 18px;
}
.admin-performance-review-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.admin-performance-review-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(230px, 1.15fr) minmax(190px, .85fr) minmax(140px, .55fr) minmax(110px, .38fr) minmax(120px, .45fr) auto;
    padding: 16px 18px;
    transition: background .2s ease, box-shadow .2s ease;
}
.admin-performance-review-row:last-child {
    border-bottom: 0;
}
.admin-performance-review-row:hover {
    background: linear-gradient(135deg, #fbfcff, #fff);
    box-shadow: inset 3px 0 0 #2e6bfb;
}
.admin-performance-member {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.admin-performance-member .avatar {
    border-radius: 14px;
    height: 44px;
    width: 44px;
}
.admin-performance-member .avatar-img {
    object-fit: cover;
}
.admin-performance-member strong,
.admin-performance-member small,
.admin-performance-period small,
.admin-performance-period strong,
.admin-performance-period span,
.admin-performance-score small,
.admin-performance-reviewer small,
.admin-performance-reviewer strong {
    display: block;
}
.admin-performance-member strong,
.admin-performance-period strong,
.admin-performance-reviewer strong {
    color: #060a3d;
    font-size: 14px;
    line-height: 1.3;
}
.admin-performance-member small,
.admin-performance-period small,
.admin-performance-period span,
.admin-performance-score small,
.admin-performance-reviewer small {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
}
.admin-performance-period span {
    margin-top: 4px;
}
.admin-performance-score {
    display: grid;
    gap: 7px;
}
.admin-performance-score .summary-meter {
    max-width: 140px;
}
.admin-performance-rating {
    align-items: center;
    display: flex;
}
.admin-performance-rating .badge {
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
    padding: 8px 12px;
    white-space: nowrap;
}
.admin-performance-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}
.admin-performance-actions form {
    margin: 0;
}
.admin-performance-actions .ym-project-row-open,
.admin-performance-delete {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    color: #64748b;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    padding: 0;
    width: 38px;
}
.admin-performance-actions .ym-project-row-open:hover {
    border-color: #bfdbfe;
    color: #085bcb;
}
.admin-performance-delete {
    border-color: #ffccd5;
    color: #dc3545;
}
.admin-performance-delete:hover {
    background: #fff5f7;
}
.admin-performance-previous-section {
    margin-top: 18px;
    overflow: hidden;
}
.admin-performance-collapse-summary {
    cursor: pointer;
    list-style: none;
    margin-bottom: 0;
    user-select: none;
}
.admin-performance-collapse-summary::-webkit-details-marker {
    display: none;
}
.admin-performance-collapse-summary::marker {
    content: "";
}
.admin-performance-previous-section[open] .ym-project-collapse-toggle i {
    transform: rotate(180deg);
}
.admin-performance-collapse-body {
    margin-top: 18px;
}
.admin-evaluation-layout {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) 320px;
}
.admin-evaluation-main {
    display: grid;
    gap: 18px;
}
.admin-evaluation-summary,
.admin-evaluation-projects {
    padding: 22px;
}
.admin-evaluation-score-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.admin-evaluation-score-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    display: grid;
    gap: 10px;
    padding: 14px;
}
.admin-evaluation-score-card > span {
    background: #e9efff;
    border-radius: 12px;
    color: #2e6bfb;
    display: grid;
    font-size: 18px;
    height: 40px;
    place-items: center;
    width: 40px;
}
.admin-evaluation-score-card small {
    color: #64748b;
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 4px;
}
.admin-evaluation-score-card strong {
    color: #060a3d;
    display: block;
    font-size: 24px;
    line-height: 1;
}
.admin-evaluation-score-card strong em {
    color: #334155;
    font-size: .58em;
    font-style: normal;
    font-weight: 650;
}
.admin-evaluation-copy-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-evaluation-copy-card {
    padding: 22px;
}
.admin-evaluation-copy-card blockquote {
    background: #f8fbff;
    border-radius: 14px;
    color: #334155;
    line-height: 1.7;
    margin: 16px 0 0;
    padding: 16px 18px;
}
.admin-evaluation-list {
    display: grid;
    gap: 10px;
    margin-top: 16px;
}
.admin-evaluation-list p {
    align-items: flex-start;
    color: #334155;
    display: flex;
    gap: 10px;
    line-height: 1.55;
    margin: 0;
}
.admin-evaluation-list i {
    color: #2e6bfb;
    margin-top: 2px;
}
.admin-evaluation-project-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.admin-evaluation-project-list article {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    padding: 15px 18px;
}
.admin-evaluation-project-list article:last-child {
    border-bottom: 0;
}
.admin-evaluation-project-list strong,
.admin-evaluation-project-list span {
    display: block;
}
.admin-evaluation-project-list strong {
    color: #060a3d;
}
.admin-evaluation-project-list span {
    color: #64748b;
    font-size: 13px;
    margin-top: 2px;
}
.admin-evaluation-sidebar {
    padding: 22px;
    position: sticky;
    top: 24px;
}
.admin-evaluation-overall {
    text-align: center;
}
.admin-evaluation-overall small {
    color: #64748b;
    display: block;
    font-weight: 700;
    margin-bottom: 8px;
}
.admin-evaluation-overall strong {
    color: #2e6bfb;
    display: block;
    font-size: 58px;
    font-weight: 750;
    letter-spacing: -1px;
    line-height: 1;
}
.admin-evaluation-overall strong.steady {
    color: #2e6bfb;
}
.admin-evaluation-overall strong.strong {
    color: #198754;
}
.admin-evaluation-overall strong.risk {
    color: #dc3545;
}
.admin-evaluation-overall strong em {
    color: #334155;
    font-size: .5em;
    font-style: normal;
    font-weight: 650;
}
.admin-evaluation-overall .badge {
    margin-top: 10px;
}
.admin-evaluation-gauge {
    background: conic-gradient(from 270deg, #2e6bfb var(--score, 0%), #e8eef7 0);
    border-radius: 50%;
    height: 126px;
    margin: 22px auto 12px;
    position: relative;
    width: 126px;
}
.admin-evaluation-gauge::before {
    background: #fff;
    border-radius: 50%;
    content: "";
    inset: 18px;
    position: absolute;
}
.admin-evaluation-gauge i {
    background: #2e6bfb;
    border-radius: 999px;
    bottom: 50%;
    height: 8px;
    left: 50%;
    position: absolute;
    transform: rotate(35deg);
    transform-origin: left center;
    width: 44px;
}
.admin-evaluation-overall p {
    color: #060a3d;
    font-weight: 700;
    margin: 0 0 18px;
}
.admin-evaluation-meta {
    border-top: 1px solid var(--line);
    display: grid;
    gap: 16px;
    margin: 18px 0;
    padding-top: 18px;
}
.admin-evaluation-meta div {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(100px, .8fr) minmax(0, 1fr);
}
.admin-evaluation-meta dt {
    align-items: center;
    color: #64748b;
    display: flex;
    font-size: 13px;
    font-weight: 650;
    gap: 8px;
    margin: 0;
}
.admin-evaluation-meta dd {
    color: #060a3d;
    font-size: 13px;
    font-weight: 650;
    margin: 0;
    text-align: right;
}
.team-icon-action.danger {
    border: 1px solid #ffccd5;
    background: #fff;
    color: #dc3545;
}
.team-icon-action:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .08);
}
.team-icon-action:disabled {
    cursor: not-allowed;
    opacity: .38;
    transform: none;
    box-shadow: none;
}
.admin-project-table {
    min-width: 1120px;
}
.admin-project-owner {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 190px;
}
.admin-project-owner .avatar {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 14px;
}
.admin-project-owner strong,
.admin-project-owner small {
    display: block;
}
.admin-project-owner strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 850;
    line-height: 1.25;
}
.admin-project-owner small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
    margin-top: 2px;
}
.admin-project-actions form {
    display: inline-flex;
}
.admin-project-actions button {
    appearance: none;
    cursor: pointer;
}
.score-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 12px;
}
.score-grid.two { grid-template-columns: repeat(2, 1fr); }
.score-grid div {
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 14px;
    background: #fbfcff;
}
.score-grid small { color: var(--muted); font-weight: 750; display: block; }
.score-grid strong { font-size: 24px; }
.big-score { text-align: center; font-size: 64px; font-weight: 900; color: var(--primary); line-height: 1; }
.big-score span { font-size: 22px; color: var(--muted); }
.timeline-item { position: relative; padding-left: 18px; }
.timeline-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--primary);
    position: absolute;
    left: 0;
}
.priority-list {
    display: grid;
    gap: 10px;
}
.priority-item {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto auto auto;
    align-items: center;
    gap: 12px;
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 12px;
    background: #fbfcff;
}
.priority-item:hover, .deadline-row:hover, .suggestion-progress:hover {
    color: inherit;
    background: #fff;
    border-color: #cbd5e1;
}
.priority-icon, .activity-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #eef4ff;
    color: var(--primary);
    flex: 0 0 auto;
}
.priority-body {
    min-width: 0;
}
.priority-body strong, .priority-body small {
    display: block;
}
.priority-body small {
    color: var(--muted);
}
.quick-action-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.quick-action {
    min-height: 86px;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px;
    color: inherit;
    background: #fbfcff;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: space-between;
}
.quick-action:hover {
    color: inherit;
    border-color: #cbd5e1;
    background: #fff;
}
.quick-action span {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 10px;
}
.quick-action strong {
    font-size: 14px;
    line-height: 1.2;
}
.approval-table td, .approval-table th {
    white-space: nowrap;
}
.chart-wrap {
    height: 260px;
    display: grid;
    place-items: center;
}
.chart-legend {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 12px;
    margin-top: 14px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}
.chart-legend span {
    display: flex;
    align-items: center;
    gap: 7px;
}
.chart-legend i {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
}
.person-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 210px;
}
.deadline-row {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    border: 1px solid var(--line);
    border-left-width: 5px;
    border-radius: 12px;
    padding: 13px 14px;
    color: inherit;
    background: #fbfcff;
    margin-bottom: 10px;
}
.deadline-row strong, .deadline-row small {
    display: block;
}
.deadline-row small {
    color: var(--muted);
}
.deadline-danger { border-left-color: #dc3545; }
.deadline-orange { border-left-color: #fd7e14; }
.deadline-warning { border-left-color: #ffc107; }
.deadline-success { border-left-color: #198754; }
.deadline-meta {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 7px;
    flex-wrap: wrap;
}
.days-pill {
    border-radius: 999px;
    background: #eef2f7;
    color: #344054;
    padding: .45rem .65rem;
    font-size: 12px;
    font-weight: 800;
}
.suggestion-progress {
    display: grid;
    grid-template-columns: minmax(230px, 1.1fr) minmax(180px, .9fr) 170px;
    gap: 14px;
    align-items: center;
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px;
    background: #fbfcff;
    margin-bottom: 10px;
}
.suggestion-details {
    display: grid;
    gap: 2px;
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
}
.progress {
    height: 7px;
    border-radius: 999px;
}
.insight-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.insight-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px;
    background: #fbfcff;
    display: flex;
    gap: 12px;
    align-items: center;
    min-height: 104px;
}
.insight-card small, .insight-card span {
    color: var(--muted);
    display: block;
    font-weight: 700;
}
.insight-card strong {
    display: block;
    font-size: 16px;
    margin: 1px 0;
}
.activity-timeline {
    display: grid;
    gap: 10px;
}
.activity-item {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
}
.activity-item strong, .activity-item small {
    display: block;
}
.activity-item small {
    color: var(--muted);
}
.attention-list,
.suggestion-compact-list {
    display: grid;
    gap: 10px;
}
.attention-item {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    align-items: center;
    gap: 11px;
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 11px 12px;
}
.attention-item:hover,
.suggestion-compact-item:hover {
    color: inherit;
    border-color: #cbd5e1;
    background: #fff;
}
.attention-icon {
    width: 40px;
    height: 40px;
    border-radius: 11px;
    display: grid;
    place-items: center;
}
.attention-copy {
    min-width: 0;
}
.attention-copy strong,
.attention-copy small,
.suggestion-compact-item strong,
.suggestion-compact-item small {
    display: block;
}
.attention-copy small,
.suggestion-compact-item small {
    color: var(--muted);
}
.compact-table > :not(caption) > * > * {
    padding: 11px 10px;
}
.compact-person {
    min-width: 170px;
}
.suggestion-mini-stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}
.mini-stat {
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 78px;
}
.mini-stat .stat-icon {
    width: 42px;
    height: 42px;
    font-size: 18px;
}
.mini-stat small {
    color: var(--muted);
    display: block;
    font-weight: 750;
}
.mini-stat strong {
    font-size: 24px;
    line-height: 1;
}
.suggestion-compact-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 12px;
}
.compact-activity {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}
.compact-activity .activity-item {
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: start;
}
.compact-activity .activity-item .badge {
    grid-column: 1 / -1;
    justify-self: start;
}
.team-hero {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, .05);
}
.team-hero-profile {
    display: flex;
    align-items: center;
    gap: 16px;
}
.team-hero h2 {
    font-size: 26px;
    font-weight: 850;
    margin: 0;
}
.team-hero p {
    color: var(--muted);
    margin: 2px 0 0;
}
.team-hero-score {
    min-width: 190px;
    border: 1px solid var(--line);
    background: #fbfcff;
    border-radius: 12px;
    padding: 14px 16px;
    text-align: right;
}
.team-hero-score small {
    color: var(--muted);
    display: block;
    font-weight: 800;
}
.team-hero-score strong {
    display: block;
    font-size: 32px;
    font-weight: 900;
    line-height: 1.1;
    margin-bottom: 6px;
}
.team-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.team-kpi-grid .stat-card {
    min-height: 118px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
}
.team-kpi-card span:last-child {
    min-width: 0;
}
.team-kpi-card em {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: 13px;
    font-style: normal;
    line-height: 1.35;
}
.onboarding-reminder-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.onboarding-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.onboarding-hero h2 {
    margin: 0 0 6px;
}
.onboarding-hero p {
    color: var(--muted);
    margin: 0;
}
.onboarding-progress-card {
    min-width: 260px;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 14px;
    background: #fbfcff;
}
.onboarding-progress-card small {
    display: block;
    color: var(--muted);
    font-weight: 700;
}
.onboarding-progress-card strong {
    display: block;
    font-size: 28px;
    line-height: 1.1;
    margin: 4px 0 10px;
}
.onboarding-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.onboarding-tabs a {
    color: var(--ink);
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    padding: 10px 14px;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    font-weight: 700;
    transition: background .16s ease, border-color .16s ease, color .16s ease;
}
.onboarding-tabs a:hover {
    color: var(--primary);
    border-color: #bfdbfe;
    background: #eff6ff;
}
.onboarding-overview-grid,
.onboarding-policy-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.onboarding-policy-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.onboarding-info-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.onboarding-info-card small {
    color: var(--muted);
    display: block;
    font-weight: 700;
}
.onboarding-info-card strong {
    display: block;
    font-size: 20px;
}
.onboarding-role-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.onboarding-role-block {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 18px;
}
.onboarding-role-block-wide {
    grid-column: 1 / -1;
}
.onboarding-role-block h3 {
    font-size: 16px;
    margin-bottom: 12px;
}
.onboarding-role-block p {
    color: var(--muted);
    margin-bottom: 0;
    line-height: 1.6;
}
.focus-project {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 18px;
}
.role-learning-focus {
    border: 1px solid #ddd6fe;
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(139, 92, 246, .055), transparent 38%),
        #fbfcff;
    padding: 18px;
}
.role-learning-focus .summary-meter span {
    background: #8b5cf6;
}
.dashboard-learning-card {
    display: flex;
    flex-direction: column;
}
.dashboard-learning-card .panel-header {
    align-items: flex-start;
}
.dashboard-learning-card .empty-state {
    flex: 1;
}
.dashboard-learning-focus {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: space-between;
    min-height: 198px;
}
.assignment-learning-focus {
    border: 1px solid #bbf7d0;
    border-radius: 14px;
    background:
        linear-gradient(135deg, rgba(22, 163, 74, .06), transparent 38%),
        #fbfcff;
    padding: 18px;
}
.assignment-learning-focus .summary-meter span {
    background: #16a34a;
}
.focus-project-main {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}
.focus-project h3,
.dashboard-learning-focus h3 {
    font-size: 22px;
    font-weight: 850;
    margin: 0 0 6px;
}
.focus-project p,
.dashboard-learning-focus p {
    color: var(--muted);
    margin-bottom: 10px;
}
.focus-project-footer {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
    align-items: center;
}
.focus-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.focus-progress {
    min-width: 0;
}
.compact-summary-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: flex-start;
}
.compact-summary-head {
    display: flex;
    align-items: center;
    gap: 12px;
}
.compact-summary-icon {
    width: 34px;
    min-width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    line-height: 1;
}
.compact-summary-icon-performance {
    color: #2563eb;
}
.compact-summary-icon-projects {
    color: #2563eb;
}
.compact-summary-icon-suggestion {
    color: #f59e0b;
}
.compact-summary-icon-ideas {
    color: #f59e0b;
}
.compact-summary-icon-onboarding {
    color: #16834f;
}
.compact-summary-icon-learning {
    color: #7c3aed;
}
.compact-summary-icon-people {
    color: #0f766e;
}
.compact-summary-head h2 {
    font-size: 18px;
    margin: 0 0 2px;
}
.compact-summary-head p,
.compact-summary-text {
    color: var(--muted);
    margin: 0;
}
.compact-summary-text {
    min-height: 42px;
    display: flex;
    align-items: center;
    line-height: 1.45;
}
.compact-summary-card > :not(.compact-summary-head):not(.btn) {
    margin-left: 46px;
}
.compact-summary-card > .btn {
    align-self: flex-start;
    margin-left: 46px;
    margin-top: auto;
    width: calc(100% - 46px) !important;
}
.compact-summary-metric,
.compact-count-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.compact-summary-metric {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 10px 12px;
    min-height: 72px;
}
.compact-summary-metric strong {
    font-size: 30px;
    line-height: 1;
}
.compact-summary-metric strong span {
    color: var(--muted);
    font-size: 16px;
    font-weight: 600;
}
.compact-count-row > div {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 10px 12px;
    flex: 1 1 92px;
    min-width: 0;
    min-height: 72px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.compact-count-row small,
.compact-progress small {
    color: var(--muted);
    display: block;
    font-weight: 700;
}
.compact-count-row strong,
.compact-progress strong {
    display: block;
    font-size: 22px;
    line-height: 1.1;
}
.compact-progress {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 10px 12px;
    min-height: 72px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.compact-leader-list {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    display: grid;
    gap: 0;
    min-height: 72px;
    padding: 8px 10px;
}
.compact-leader-list div {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 5px 0;
}
.compact-leader-list div + div {
    border-top: 1px solid #edf2f7;
}
.compact-leader-list span {
    color: var(--ink);
    font-size: 13px;
    font-weight: 650;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.compact-leader-list strong {
    color: var(--primary);
    font-size: 15px;
    line-height: 1;
}
.compact-leader-list p {
    align-self: center;
    color: var(--muted);
    font-size: 13px;
    margin: 0;
}
.admin-summary-six-grid > [class*="col-"] {
    display: flex;
}
.admin-summary-six-grid .compact-summary-card {
    --summary-accent: var(--primary);
    --summary-soft: #eff6ff;
    --summary-border: #dbe7ff;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--summary-accent) 9%, #fff) 0%, #fff 46%),
        radial-gradient(circle at top right, color-mix(in srgb, var(--summary-accent) 16%, transparent) 0, transparent 40%),
        #fff;
    border-color: var(--summary-border);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .065);
    min-height: 300px;
    overflow: hidden;
    padding: 22px;
    position: relative;
    width: 100%;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.admin-summary-six-grid .compact-summary-card:hover {
    border-color: color-mix(in srgb, var(--summary-accent) 36%, var(--line));
    box-shadow: 0 24px 54px rgba(15, 23, 42, .09);
    transform: translateY(-2px);
}
.admin-summary-six-grid .compact-summary-card::before {
    background: linear-gradient(180deg, var(--summary-accent), color-mix(in srgb, var(--summary-accent) 35%, #fff));
    border-radius: 0 999px 999px 0;
    content: "";
    height: 72px;
    left: 0;
    opacity: .95;
    position: absolute;
    top: 24px;
    width: 5px;
}
.admin-summary-six-grid .compact-summary-card::after {
    background: var(--summary-accent);
    border-radius: 999px;
    content: "";
    height: 7px;
    opacity: .12;
    position: absolute;
    right: 22px;
    top: 24px;
    width: 58px;
}
.compact-summary-card-projects {
    --summary-accent: #2e6bfb;
    --summary-soft: #eff6ff;
    --summary-border: #cfe0ff;
}
.compact-summary-card-performance {
    --summary-accent: #16834f;
    --summary-soft: #ecfdf5;
    --summary-border: #c9f1da;
}
.compact-summary-card-ideas {
    --summary-accent: #f59e0b;
    --summary-soft: #fff7ed;
    --summary-border: #fde3b4;
}
.compact-summary-card-onboarding {
    --summary-accent: #7c3aed;
    --summary-soft: #f5f0ff;
    --summary-border: #ddd0ff;
}
.compact-summary-card-learning {
    --summary-accent: #0891b2;
    --summary-soft: #ecfeff;
    --summary-border: #bae6fd;
}
.compact-summary-card-people {
    --summary-accent: #0f766e;
    --summary-soft: #f0fdfa;
    --summary-border: #bfeee7;
}
.admin-summary-six-grid .compact-summary-head {
    align-items: flex-start;
    gap: 16px;
}
.admin-summary-six-grid .compact-summary-icon {
    align-items: center;
    background: linear-gradient(135deg, var(--summary-accent), color-mix(in srgb, var(--summary-accent) 72%, #fff));
    border: 0;
    border-radius: 18px;
    color: #fff;
    display: inline-flex;
    font-size: 22px;
    height: 54px;
    justify-content: center;
    min-width: 54px;
    width: 54px;
    box-shadow: 0 14px 28px color-mix(in srgb, var(--summary-accent) 22%, transparent);
}
.admin-summary-six-grid .compact-summary-head h2 {
    font-size: 20px;
    margin-top: 3px;
}
.admin-summary-six-grid .compact-summary-card > :not(.compact-summary-head):not(.btn),
.admin-summary-six-grid .compact-summary-card > .btn {
    margin-left: 0;
}
.admin-summary-six-grid .compact-summary-card > .btn {
    border-color: color-mix(in srgb, var(--summary-accent) 75%, #fff);
    color: var(--summary-accent);
    width: 100% !important;
}
.admin-summary-six-grid .compact-summary-card > .btn:hover {
    background: var(--summary-accent);
    color: #fff;
}
.admin-summary-six-grid .compact-count-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.admin-summary-six-grid .compact-count-row > div,
.admin-summary-six-grid .compact-progress,
.admin-summary-six-grid .compact-leader-list {
    background: rgba(255, 255, 255, .76);
    border-color: color-mix(in srgb, var(--summary-accent) 20%, var(--line));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}
.admin-summary-six-grid .compact-count-row > div {
    min-height: 76px;
    padding: 13px 14px;
}
.admin-summary-six-grid .compact-count-row strong,
.admin-summary-six-grid .compact-progress strong {
    color: var(--ink);
    font-size: 26px;
}
.admin-summary-six-grid .compact-count-row small,
.admin-summary-six-grid .compact-progress small {
    font-size: 13px;
    font-weight: 650;
}
.admin-summary-six-grid .compact-progress {
    min-height: 78px;
    padding: 13px 14px;
}
.admin-summary-six-grid .summary-meter span {
    background: var(--summary-accent);
}
.admin-summary-six-grid .compact-leader-list div {
    background: rgba(255, 255, 255, .74);
    border: 1px solid color-mix(in srgb, var(--summary-accent) 10%, transparent);
    border-radius: 10px;
    padding: 7px 9px;
}
.admin-summary-six-grid .compact-leader-list div + div {
    border-top: 1px solid color-mix(in srgb, var(--summary-accent) 10%, transparent);
}
.admin-summary-six-grid .compact-leader-list strong {
    background: var(--summary-soft);
    border-radius: 999px;
    color: var(--summary-accent);
    min-width: 28px;
    padding: 5px 8px;
    text-align: center;
}
.admin-pinned-workload {
    background:
        linear-gradient(135deg, rgba(46, 107, 251, .055), rgba(22, 131, 79, .035) 48%, rgba(255, 255, 255, 0) 75%),
        #fff;
    display: grid;
    gap: 16px;
    overflow: hidden;
    position: relative;
}
.admin-pinned-workload::before {
    background: linear-gradient(90deg, #2e6bfb, #7c3aed, #16834f);
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.admin-pin-manager {
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 16px;
    padding: 16px;
}
.admin-pin-manager-head {
    align-items: center;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 14px;
}
.admin-pin-manager-head strong,
.admin-pin-manager-head span {
    display: block;
}
.admin-pin-manager-head span {
    color: var(--muted);
    font-size: 13px;
}
.admin-pin-picker {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.admin-pin-option {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    cursor: pointer;
    display: flex;
    gap: 12px;
    margin: 0;
    min-width: 0;
    padding: 12px;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.admin-pin-option:hover {
    border-color: #bcd1ff;
    box-shadow: 0 12px 26px rgba(46, 107, 251, .08);
    transform: translateY(-1px);
}
.admin-pin-option input {
    accent-color: var(--primary);
    height: 18px;
    width: 18px;
}
.admin-pin-option span:last-child {
    display: block;
    min-width: 0;
}
.admin-pin-option strong,
.admin-pin-option small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-pin-option small {
    color: var(--muted);
}
.admin-pinned-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.admin-pinned-card {
    --pin-accent: #2e6bfb;
    --pin-soft: #eff6ff;
    background:
        linear-gradient(160deg, color-mix(in srgb, var(--pin-accent) 9%, #fff), #fff 38%),
        #fff;
    border: 1px solid color-mix(in srgb, var(--pin-accent) 19%, var(--line));
    border-radius: 22px;
    box-shadow: 0 20px 48px rgba(15, 23, 42, .075);
    display: flex;
    flex-direction: column;
    min-height: 340px;
    overflow: hidden;
    padding: 18px;
    position: relative;
    transition: box-shadow .18s ease, transform .18s ease;
}
.admin-pinned-card:hover {
    box-shadow: 0 22px 50px rgba(15, 23, 42, .09);
    transform: translateY(-2px);
}
.admin-pinned-card::before {
    background: linear-gradient(90deg, var(--pin-accent), color-mix(in srgb, var(--pin-accent) 18%, transparent));
    content: "";
    height: 6px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.admin-pinned-card::after {
    background: var(--pin-accent);
    border-radius: 50%;
    content: "";
    height: 104px;
    opacity: .07;
    position: absolute;
    right: -36px;
    top: -36px;
    width: 104px;
}
.admin-pinned-card-blue {
    --pin-accent: #2e6bfb;
    --pin-soft: #eff6ff;
}
.admin-pinned-card-green {
    --pin-accent: #16834f;
    --pin-soft: #ecfdf5;
}
.admin-pinned-card-purple {
    --pin-accent: #7c3aed;
    --pin-soft: #f5f0ff;
}
.admin-pinned-member {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding-bottom: 12px;
    position: relative;
    z-index: 1;
}
.admin-pinned-member .avatar-xl {
    border: 3px solid #fff;
    border-radius: 18px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--pin-accent) 18%, transparent);
    height: 58px;
    width: 58px;
}
.admin-pinned-member h3 {
    font-size: 18px;
    margin: 0 0 2px;
}
.admin-pinned-member p {
    color: var(--muted);
    font-size: 13px;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-pinned-count {
    align-items: center;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--pin-accent) 22%, #fff);
    border-radius: 999px;
    color: var(--pin-accent);
    display: inline-flex;
    font-size: 13px;
    font-weight: 800;
    height: 32px;
    justify-content: center;
    min-width: 82px;
    padding: 0 12px;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--pin-accent) 12%, transparent);
}
.admin-pinned-mini-stats {
    border-bottom: 1px solid color-mix(in srgb, var(--pin-accent) 13%, var(--line));
    border-top: 1px solid color-mix(in srgb, var(--pin-accent) 13%, var(--line));
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 10px 0;
    position: relative;
    z-index: 1;
}
.admin-pinned-mini-stats span {
    background: rgba(255, 255, 255, .82);
    border: 1px solid color-mix(in srgb, var(--pin-accent) 12%, var(--line));
    border-radius: 12px;
    color: var(--muted);
    font-size: 12px;
    padding: 8px;
    text-align: center;
}
.admin-pinned-mini-stats strong {
    color: var(--ink);
    display: block;
    font-size: 18px;
    line-height: 1;
}
.admin-pinned-project-list {
    align-content: start;
    display: grid;
    gap: 8px;
    grid-auto-rows: 64px;
    height: calc((64px * 8) + (8px * 7));
    margin-top: 12px;
    max-height: calc((64px * 8) + (8px * 7));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 4px;
    position: relative;
    scrollbar-color: color-mix(in srgb, var(--pin-accent) 45%, #cbd5e1) #eef2f7;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    z-index: 1;
}
.admin-pinned-project-list::-webkit-scrollbar {
    width: 8px;
}
.admin-pinned-project-list::-webkit-scrollbar-track {
    background: #eef2f7;
    border-radius: 999px;
}
.admin-pinned-project-list::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--pin-accent) 42%, #cbd5e1);
    border-radius: 999px;
}
.admin-pinned-project {
    align-items: center;
    background: rgba(255, 255, 255, .86);
    border: 1px solid #eef2f7;
    border-radius: 15px;
    color: inherit;
    display: grid;
    gap: 12px;
    grid-template-columns: 26px auto minmax(0, 1fr) auto;
    height: 64px;
    min-height: 64px;
    padding: 10px 12px 10px 8px;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.admin-pinned-project:hover {
    background: #fff;
    border-color: color-mix(in srgb, var(--pin-accent) 24%, var(--line));
    color: inherit;
    transform: translateX(2px);
}
.admin-pinned-project.is-dragging {
    background: #fff;
    border-color: color-mix(in srgb, var(--pin-accent) 42%, var(--line));
    box-shadow: 0 16px 34px rgba(15, 23, 42, .14);
    opacity: .92;
}
.admin-pinned-project-list.is-saving .admin-pinned-project {
    cursor: wait;
}
.admin-pinned-project-list.is-saved {
    outline: 2px solid color-mix(in srgb, var(--pin-accent) 34%, transparent);
    outline-offset: 3px;
}
.admin-pinned-project-drag {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: #94a3b8;
    cursor: grab;
    display: inline-flex;
    font-size: 18px;
    height: 30px;
    justify-content: center;
    padding: 0;
    touch-action: none;
    width: 24px;
}
.admin-pinned-project-drag:hover,
.admin-pinned-project-drag:focus {
    background: color-mix(in srgb, var(--pin-accent) 9%, #fff);
    color: var(--pin-accent);
    outline: 0;
}
.admin-pinned-project-drag:active {
    cursor: grabbing;
}
.admin-pinned-project a {
    color: #111827;
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-pinned-project a:hover {
    color: var(--pin-accent);
}
.admin-pinned-project small {
    color: #64748b;
    display: block;
    font-size: 12px;
    line-height: 1.35;
    margin-top: 2px;
}
.admin-pinned-project em {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 999px;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    padding: 6px 9px;
    white-space: nowrap;
}
.admin-pinned-project-dot {
    border-radius: 999px;
    height: 10px;
    width: 10px;
}
.admin-pinned-project-dot-danger {
    background: #e11d48;
}
.admin-pinned-project-dot-warning {
    background: #f59e0b;
}
.admin-pinned-project-dot-muted {
    background: var(--pin-accent);
    opacity: .38;
}
.admin-command-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.admin-command-card {
    --command-accent: #2e6bfb;
    --command-soft: #eff6ff;
    --command-border: #dbe7ff;
    background:
        radial-gradient(circle at 95% 4%, color-mix(in srgb, var(--command-accent) 18%, transparent) 0, transparent 34%),
        linear-gradient(145deg, color-mix(in srgb, var(--command-accent) 8%, #fff), #fff 42%),
        #fff;
    border: 1px solid var(--command-border);
    border-radius: 22px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .065);
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 310px;
    overflow: hidden;
    padding: 22px;
    position: relative;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.admin-command-card::before {
    background: linear-gradient(180deg, var(--command-accent), color-mix(in srgb, var(--command-accent) 32%, #fff));
    border-radius: 0 0 999px 999px;
    content: "";
    height: 6px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.admin-command-card:hover {
    border-color: color-mix(in srgb, var(--command-accent) 30%, var(--line));
    box-shadow: 0 24px 54px rgba(15, 23, 42, .085);
    transform: translateY(-2px);
}
.admin-command-card-projects {
    --command-accent: #2e6bfb;
    --command-soft: #eff6ff;
    --command-border: #cfe0ff;
}
.admin-command-card-performance {
    --command-accent: #16834f;
    --command-soft: #ecfdf5;
    --command-border: #c8f0d9;
}
.admin-command-card-ideas {
    --command-accent: #f59e0b;
    --command-soft: #fff7ed;
    --command-border: #fde4b7;
}
.admin-command-card-onboarding {
    --command-accent: #7c3aed;
    --command-soft: #f5f0ff;
    --command-border: #ded1ff;
}
.admin-command-card-learning {
    --command-accent: #0891b2;
    --command-soft: #ecfeff;
    --command-border: #bae6fd;
}
.admin-command-card-people {
    --command-accent: #0f766e;
    --command-soft: #f0fdfa;
    --command-border: #bfeee7;
}
.admin-command-head {
    align-items: flex-start;
    display: flex;
    gap: 14px;
    min-width: 0;
    position: relative;
    z-index: 1;
}
.admin-command-icon {
    align-items: center;
    background: linear-gradient(135deg, var(--command-accent), color-mix(in srgb, var(--command-accent) 74%, #fff));
    border-radius: 18px;
    box-shadow: 0 16px 30px color-mix(in srgb, var(--command-accent) 20%, transparent);
    color: #fff;
    display: inline-flex;
    flex: 0 0 54px;
    font-size: 22px;
    height: 54px;
    justify-content: center;
    width: 54px;
}
.admin-command-head h2 {
    color: var(--ink);
    font-size: 22px;
    font-weight: 760;
    letter-spacing: 0;
    line-height: 1.15;
    margin: 2px 0 4px;
}
.admin-command-head p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.35;
    margin: 0;
}
.admin-command-metrics {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.admin-command-metrics > div,
.admin-command-progress,
.admin-command-leaders {
    background: rgba(255, 255, 255, .8);
    border: 1px solid color-mix(in srgb, var(--command-accent) 18%, var(--line));
    border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}
.admin-command-metrics > div {
    min-height: 78px;
    padding: 14px;
}
.admin-command-metrics small,
.admin-command-progress small {
    color: var(--muted);
    display: block;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.2;
}
.admin-command-metrics strong {
    color: var(--ink);
    display: block;
    font-size: 28px;
    line-height: 1;
    margin-top: 5px;
}
.admin-command-progress {
    display: grid;
    gap: 10px;
    padding: 14px;
}
.admin-command-progress > span {
    align-items: center;
    display: flex;
    gap: 14px;
    justify-content: space-between;
}
.admin-command-progress strong {
    color: var(--ink);
    font-size: 24px;
    line-height: 1;
}
.admin-command-progress .summary-meter {
    height: 9px;
}
.admin-command-progress .summary-meter span {
    background: var(--command-accent);
}
.admin-command-leaders {
    display: grid;
    gap: 8px;
    min-height: 76px;
    padding: 12px;
}
.admin-command-leaders span {
    align-items: center;
    background: color-mix(in srgb, var(--command-soft) 70%, #fff);
    border-radius: 12px;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    min-width: 0;
    padding: 8px 10px;
}
.admin-command-leaders em {
    color: var(--ink);
    font-style: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-command-leaders strong {
    align-items: center;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--command-accent) 22%, var(--line));
    border-radius: 999px;
    color: var(--command-accent);
    display: inline-flex;
    font-size: 13px;
    height: 28px;
    justify-content: center;
    min-width: 32px;
    padding: 0 8px;
}
.admin-command-leaders p {
    align-self: center;
    color: var(--muted);
    font-size: 13px;
    margin: 0;
}
.admin-command-link {
    align-items: center;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--command-accent) 72%, #fff);
    border-radius: 14px;
    color: var(--command-accent);
    display: inline-flex;
    font-weight: 760;
    gap: 8px;
    justify-content: center;
    margin-top: auto;
    min-height: 42px;
    padding: 10px 14px;
    transition: background .16s ease, color .16s ease, transform .16s ease;
}
.admin-command-link:hover {
    background: var(--command-accent);
    color: #fff;
    transform: translateY(-1px);
}
@media (max-width: 1199px) {
    .admin-command-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 767px) {
    .admin-command-grid {
        grid-template-columns: 1fr;
    }
    .admin-command-card {
        min-height: auto;
        padding: 18px;
    }
}
.admin-pinned-project strong,
.admin-pinned-project small,
.admin-pinned-project em {
    display: block;
}
.admin-pinned-project strong {
    font-size: 13.5px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin-pinned-project small {
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
}
.admin-pinned-project em {
    background: #fff;
    border: 1px solid #edf2f7;
    border-radius: 999px;
    font-size: 12px;
    font-style: normal;
    font-weight: 750;
    padding: 5px 8px;
    white-space: nowrap;
}
.admin-pinned-empty {
    align-items: center;
    color: var(--muted);
    display: flex;
    gap: 8px;
    padding: 18px 8px;
}
.admin-pinned-empty i {
    color: #16834f;
}
.admin-pinned-footer {
    align-items: center;
    background: linear-gradient(135deg, var(--pin-accent), color-mix(in srgb, var(--pin-accent) 78%, #fff));
    border-radius: 14px;
    color: var(--pin-accent);
    display: inline-flex;
    font-weight: 750;
    gap: 8px;
    justify-content: center;
    margin-top: auto;
    color: #fff;
    padding: 11px 12px;
    position: relative;
    z-index: 1;
    transition: background .16s ease, color .16s ease;
}
.admin-pinned-footer:hover {
    background: color-mix(in srgb, var(--pin-accent) 86%, #000);
    color: #fff;
}
.focus-project-footer small, .idea-meter small {
    color: var(--muted);
    display: block;
    font-weight: 800;
}
.focus-project-footer strong, .idea-meter strong {
    display: block;
    font-size: 18px;
    font-weight: 850;
}
.team-project-list, .team-suggestion-list {
    display: grid;
    gap: 10px;
}
.team-project-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    color: inherit;
    padding: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}
.team-project-card:hover, .team-suggestion-card:hover {
    color: inherit;
    background: #fff;
    border-color: #cbd5e1;
}
.team-project-card strong, .team-project-card small {
    display: block;
}
.team-project-card small {
    color: var(--muted);
}
.team-project-meta {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 8px;
    flex-wrap: wrap;
}
.orientation-dashboard-card {
    background: linear-gradient(135deg, #ffffff 0%, #f7faff 100%);
    border: 1px solid #cfe0ff;
    border-radius: 14px;
    box-shadow: 0 16px 42px rgba(37, 99, 235, .08);
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
    gap: 18px;
    padding: 20px;
    align-items: center;
}
.orientation-dashboard-main {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    min-width: 0;
}
.orientation-dashboard-main h2 {
    color: var(--ink);
    font-size: 22px;
    font-weight: 900;
    margin: 2px 0 6px;
}
.orientation-dashboard-main p {
    color: var(--muted);
    margin: 0;
    max-width: 820px;
}
.orientation-dashboard-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
}
.orientation-dashboard-meta span:not(.badge) {
    color: #475569;
    font-size: 13px;
    font-weight: 800;
}
.orientation-dashboard-progress {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    display: grid;
    gap: 12px;
    padding: 16px;
}
.orientation-dashboard-progress > div:first-child {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 12px;
}
.orientation-dashboard-progress small {
    color: var(--muted);
    font-weight: 800;
}
.orientation-dashboard-progress strong {
    color: var(--ink);
    font-size: 26px;
    font-weight: 900;
    line-height: 1;
}
.orientation-dashboard-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.orientation-panel {
    border: 1px solid #cfe0ff;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    padding: 18px;
}
.orientation-progress-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}
.orientation-progress-head h3 {
    color: var(--ink);
    font-size: 19px;
    font-weight: 900;
    margin: 0;
}
.orientation-progress-head p {
    color: var(--muted);
    margin: 4px 0 0;
    font-weight: 750;
}
.orientation-meter {
    height: 10px;
    margin-top: 14px;
}
.orientation-checklist {
    display: grid;
    gap: 14px;
    margin-top: 16px;
}
.orientation-section {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    padding: 15px;
}
.orientation-section h4 {
    color: var(--ink);
    font-size: 16px;
    font-weight: 900;
    margin: 0 0 8px;
}
.orientation-section p {
    color: var(--muted);
    margin-bottom: 10px;
    font-weight: 650;
}
.orientation-check-item {
    border-top: 1px solid var(--line);
    color: #344054;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 10px 0;
    font-weight: 650;
}
.orientation-check-item:first-of-type {
    border-top: 0;
}
.orientation-check-item input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--primary);
}
.orientation-check-item.readonly {
    grid-template-columns: 22px minmax(0, 1fr);
}
.orientation-submit-form {
    border-top: 1px solid var(--line);
    margin-top: 16px;
    padding-top: 16px;
}
.orientation-page-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
}
.orientation-page-head h2 {
    color: var(--ink);
    font-size: 28px;
    font-weight: 750;
    letter-spacing: 0;
    margin: 0 0 8px;
}
.orientation-page-head p {
    color: var(--muted);
    font-size: 15px;
    margin: 0;
}
.orientation-status-card {
    min-width: 245px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .04);
}
.orientation-status-card i {
    font-size: 18px;
    margin-top: 2px;
}
.orientation-status-card-success i {
    color: #16a34a;
}
.orientation-status-card-primary i {
    color: var(--primary);
}
.orientation-status-card-warning i {
    color: #f59e0b;
}
.orientation-status-card strong,
.orientation-status-card small {
    display: block;
}
.orientation-status-card strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 750;
}
.orientation-status-card small {
    color: var(--muted);
    font-size: 12.5px;
    line-height: 1.45;
    margin-top: 4px;
}
.orientation-progress-shell {
    padding: 18px;
}
.orientation-progress-grid {
    display: grid;
    grid-template-columns: minmax(250px, 1.35fr) repeat(3, minmax(150px, .75fr));
    align-items: center;
}
.orientation-progress-main,
.orientation-progress-stat {
    min-height: 78px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 22px;
    border-right: 1px solid var(--line);
}
.orientation-progress-main {
    padding-left: 0;
}
.orientation-progress-stat:last-child {
    border-right: 0;
}
.orientation-progress-icon {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #dcfce7;
    color: #16a34a;
    font-size: 28px;
    flex: 0 0 70px;
}
.orientation-progress-main small,
.orientation-progress-stat small,
.orientation-progress-stat span {
    display: block;
}
.orientation-progress-main small,
.orientation-progress-stat small {
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 700;
}
.orientation-progress-main strong {
    color: #16a34a;
    display: inline-block;
    font-size: 34px;
    font-weight: 780;
    line-height: 1;
    margin: 5px 8px 0 0;
    vertical-align: middle;
}
.orientation-progress-stat > i {
    color: #64748b;
    font-size: 19px;
}
.orientation-progress-stat strong {
    color: var(--ink);
    display: block;
    font-size: 17px;
    font-weight: 720;
    margin-top: 4px;
}
.orientation-progress-stat span {
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
}
.orientation-wide-meter {
    height: 12px;
    margin-top: 18px;
}
.orientation-wide-meter span {
    background: #16a34a;
}
.orientation-guidelines-wrap {
    display: grid;
    gap: 14px;
}
.orientation-guidelines-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}
.orientation-guidelines-head h2 {
    color: var(--ink);
    font-size: 21px;
    font-weight: 750;
    margin: 0 0 5px;
}
.orientation-guidelines-head p {
    color: var(--muted);
    margin: 0;
}
.orientation-expand-all {
    color: var(--primary);
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
}
.orientation-section-list {
    display: grid;
    gap: 14px;
}
.orientation-guide-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(15, 23, 42, .035);
    overflow: hidden;
}
.orientation-guide-card summary {
    list-style: none;
    cursor: pointer;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto auto 18px;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
}
.orientation-guide-card summary::-webkit-details-marker {
    display: none;
}
.orientation-guide-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 20px;
    box-shadow: 0 12px 24px rgba(8, 91, 203, .12);
}
.orientation-guide-blue .orientation-guide-icon {
    background: #2e6bfb;
}
.orientation-guide-purple .orientation-guide-icon {
    background: #8b5cf6;
}
.orientation-guide-orange .orientation-guide-icon {
    background: #f59e0b;
}
.orientation-guide-green .orientation-guide-icon {
    background: #16a34a;
}
.orientation-guide-pink .orientation-guide-icon {
    background: #f43f5e;
}
.orientation-guide-copy strong,
.orientation-guide-copy small {
    display: block;
}
.orientation-guide-copy strong {
    color: var(--ink);
    font-size: 16px;
    font-weight: 750;
}
.orientation-guide-copy small {
    color: var(--muted);
    font-size: 13.5px;
    line-height: 1.45;
    margin-top: 5px;
}
.orientation-item-count {
    border-radius: 999px;
    background: #eef4ff;
    color: var(--primary);
    font-size: 12px;
    font-weight: 750;
    padding: 5px 9px;
    white-space: nowrap;
}
.orientation-guide-purple .orientation-item-count {
    background: #f3e8ff;
    color: #7c3aed;
}
.orientation-guide-orange .orientation-item-count {
    background: #fff7ed;
    color: #ea580c;
}
.orientation-guide-green .orientation-item-count {
    background: #ecfdf5;
    color: #15803d;
}
.orientation-guide-pink .orientation-item-count {
    background: #fff1f2;
    color: #e11d48;
}
.orientation-guide-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    font-weight: 750;
    white-space: nowrap;
}
.orientation-guide-status.is-complete {
    color: #16a34a;
}
.orientation-guide-status.is-pending {
    color: #f59e0b;
}
.orientation-guide-caret {
    color: #64748b;
    transition: transform .18s ease;
}
.orientation-guide-card[open] .orientation-guide-caret {
    transform: rotate(180deg);
}
.orientation-guide-body {
    border-top: 1px solid var(--line);
    display: grid;
    gap: 16px;
    padding: 18px 22px 20px;
}
.orientation-guide-body > p {
    color: var(--muted);
    margin: 0;
    line-height: 1.6;
}
.orientation-link-card {
    border: 1px solid #dbeafe;
    border-radius: 12px;
    color: var(--primary);
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 12px;
    max-width: 620px;
    padding: 14px;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.orientation-link-card:hover {
    border-color: #93c5fd;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .08);
    transform: translateY(-1px);
}
.orientation-link-card strong,
.orientation-link-card small {
    display: block;
}
.orientation-link-card strong {
    color: var(--primary);
    font-size: 14px;
}
.orientation-link-card small {
    color: var(--muted);
    overflow-wrap: anywhere;
}
.orientation-check-grid {
    display: grid;
    gap: 10px;
}
.orientation-check-card {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fbfdff;
    color: var(--ink);
    cursor: pointer;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 12px;
    align-items: flex-start;
    padding: 13px 14px;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.orientation-check-card:hover {
    border-color: #bfdbfe;
    background: #fff;
    box-shadow: 0 10px 22px rgba(15, 23, 42, .04);
}
.orientation-check-card.is-checked {
    border-color: #bbf7d0;
    background: #f0fdf4;
}
.orientation-check-card input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: #16a34a;
}
.orientation-check-card strong,
.orientation-check-card small {
    display: block;
}
.orientation-check-card strong {
    color: #334155;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.45;
}
.orientation-check-card small {
    color: #16a34a;
    font-size: 12px;
    margin-top: 5px;
}
.orientation-action-panel,
.orientation-submit-panel {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
}
.orientation-action-panel strong,
.orientation-action-panel small {
    display: block;
}
.orientation-action-panel strong {
    color: var(--ink);
    font-size: 15px;
    font-weight: 750;
}
.orientation-action-panel small {
    color: var(--muted);
    margin-top: 4px;
}
.orientation-action-controls {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.orientation-submit-panel {
    margin-top: 14px;
}
.orientation-submit-panel > div {
    flex: 1 1 auto;
}
.orientation-profile-hero {
    margin-bottom: 16px;
}
.orientation-profile-hero h2 {
    color: var(--ink);
    font-size: clamp(24px, 2.2vw, 32px);
    font-weight: 650;
    line-height: 1.1;
    margin: 0 0 8px;
}
.orientation-profile-hero p {
    color: var(--muted);
    margin: 0;
}
.orientation-profile-hero .profile-title-icon {
    font-size: 24px;
    margin-top: 3px;
}
.orientation-status-card {
    background: #fbfcff;
    box-shadow: none;
}
.orientation-status-card-success i,
.orientation-guide-status.is-complete {
    color: #16834f;
}
.orientation-status-card-primary i,
.orientation-status-card-warning i {
    color: var(--primary);
}
.orientation-progress-shell {
    margin-top: 0;
}
.orientation-progress-grid {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}
.orientation-progress-main,
.orientation-progress-stat {
    min-height: 74px;
    background: transparent;
}
.orientation-progress-icon {
    width: 48px;
    height: 48px;
    flex-basis: 48px;
    border-radius: 12px;
    background: #eef4ff;
    color: var(--primary);
    font-size: 21px;
}
.orientation-progress-main strong {
    color: var(--ink);
    font-size: 30px;
    font-weight: 650;
}
.orientation-progress-stat > i {
    color: var(--primary);
}
.orientation-wide-meter {
    height: 9px;
}
.orientation-wide-meter span {
    background: #16834f;
}
.orientation-guidelines-wrap {
    display: block;
    margin-top: 16px;
}
.orientation-guidelines-head {
    align-items: flex-start;
    margin-bottom: 14px;
}
.orientation-guidelines-head h2 {
    font-size: 20px;
    font-weight: 650;
    margin-bottom: 4px;
}
.orientation-section-list {
    gap: 12px;
}
.orientation-guide-card {
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
}
.orientation-guide-card summary {
    grid-template-columns: 48px minmax(0, 1fr) auto 18px;
    padding: 15px 16px;
}
.orientation-guide-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    color: #fff;
    font-size: 20px;
    box-shadow: 0 12px 24px rgba(8, 91, 203, .12);
}
.orientation-guide-blue .orientation-guide-icon,
.orientation-guide-purple .orientation-guide-icon,
.orientation-guide-orange .orientation-guide-icon,
.orientation-guide-green .orientation-guide-icon,
.orientation-guide-pink .orientation-guide-icon {
    background: var(--primary);
}
.orientation-guide-purple .orientation-guide-icon {
    background: #8b5cf6;
}
.orientation-guide-orange .orientation-guide-icon {
    background: #f59e0b;
}
.orientation-guide-green .orientation-guide-icon {
    background: #16a34a;
}
.orientation-guide-pink .orientation-guide-icon {
    background: #f43f5e;
}
.orientation-guide-copy strong {
    font-size: 15px;
    font-weight: 650;
}
.orientation-guide-copy small {
    font-size: 13px;
}
.orientation-item-count {
    border-color: #bfdbfe;
    background: #eff6ff !important;
    color: var(--primary) !important;
    font-weight: 650;
}
.orientation-guide-status {
    font-weight: 650;
}
.orientation-guide-status.is-pending {
    color: var(--primary);
}
.orientation-guide-body {
    background: #fff;
    padding: 16px;
}
.orientation-link-card {
    background: #fff;
}
.orientation-check-card {
    background: #fff;
}
.orientation-check-grid {
    grid-template-columns: repeat(2, minmax(280px, 1fr));
    align-items: stretch;
}
.orientation-check-grid-single {
    grid-template-columns: 1fr;
}
.orientation-platform-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.orientation-platform-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    display: grid;
    gap: 12px;
    justify-items: center;
    min-width: 0;
    padding: 14px;
    position: relative;
}
.orientation-platform-check {
    align-items: center;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .08);
    display: inline-flex;
    height: 28px;
    justify-content: center;
    position: absolute;
    right: 12px;
    top: 12px;
    width: 28px;
}
.orientation-platform-check input {
    accent-color: var(--primary);
    height: 15px;
    margin: 0;
    width: 15px;
}
.orientation-platform-meta {
    align-items: center;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 28px;
    gap: 10px;
    justify-self: stretch;
}
.orientation-platform-icon {
    align-items: center;
    background: #eef4ff;
    border-radius: 10px;
    color: var(--primary);
    display: inline-flex;
    font-size: 18px;
    height: 38px;
    justify-content: center;
    width: 38px;
}
.orientation-platform-meta strong,
.orientation-platform-meta small {
    display: block;
}
.orientation-platform-meta strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 650;
    line-height: 1.25;
}
.orientation-platform-meta small {
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.orientation-platform-qr {
    align-items: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    display: flex;
    height: 122px;
    justify-content: center;
    padding: 7px;
    width: 122px;
}
.orientation-platform-qr svg {
    display: block;
    height: 108px;
    width: 108px;
}
.orientation-platform-card .btn {
    width: 100%;
}
.orientation-platform-empty {
    align-items: center;
    border: 1px dashed #cbd5e1;
    border-radius: 14px;
    color: var(--muted);
    display: flex;
    gap: 10px;
    grid-column: 1 / -1;
    justify-content: center;
    padding: 18px;
}
.orientation-declaration-card {
    border: 1px solid #dbeafe;
    border-radius: 14px;
    background: #fff;
    display: grid;
    gap: 14px;
    padding: 16px;
}
.orientation-declaration-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
}
.orientation-declaration-head h3 {
    color: var(--ink);
    font-size: 15px;
    font-weight: 650;
    margin: 0 0 4px;
}
.orientation-declaration-head p {
    color: var(--muted);
    font-size: 13px;
    margin: 0;
}
.orientation-declaration-check {
    align-items: center;
    color: var(--ink);
    display: inline-flex;
    gap: 10px;
    line-height: 1.35;
    margin-top: 6px;
}
.orientation-declaration-check input {
    accent-color: var(--primary);
    flex: 0 0 auto;
    height: 16px;
    margin: 0;
    width: 16px;
}
.orientation-declaration-check span {
    font-size: 14px;
    font-weight: 500;
}
.orientation-check-card.is-checked {
    border-color: #bfdbfe;
    background: #fff;
}
.orientation-check-card input {
    accent-color: var(--primary);
}
.orientation-check-card strong {
    font-weight: 600;
}
.orientation-check-card small {
    color: var(--muted);
    font-weight: 400;
}
.orientation-action-panel,
.orientation-submit-panel {
    background: #fbfcff;
}
.orientation-list-progress {
    min-width: 170px;
    display: grid;
    gap: 5px;
}
.orientation-list-progress strong,
.orientation-list-progress small {
    display: block;
    color: #475569;
    font-size: 12px;
    font-weight: 850;
}
.smart-health-form {
    width: 100%;
}
.smart-health-form button {
    justify-self: end;
}
.orientation-template-hero {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
}
.orientation-template-hero h2 {
    color: var(--ink);
    font-size: 24px;
    font-weight: 760;
    letter-spacing: 0;
    margin: 3px 0 4px;
}
.orientation-template-hero p {
    color: var(--muted);
    margin: 0;
    max-width: 760px;
    font-size: 14px;
    font-weight: 520;
}
.orientation-template-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 12px;
}
.orientation-template-meta span {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 999px;
    color: #475569;
    display: inline-flex;
    font-size: 12px;
    font-weight: 650;
    gap: 6px;
    line-height: 1;
    padding: 7px 10px;
}
.orientation-template-meta i {
    color: #2e6bfb;
    font-size: 13px;
}
.orientation-template-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.orientation-admin-hero {
    align-items: flex-start;
    padding: 22px;
}
.orientation-admin-copy {
    display: grid;
    gap: 14px;
    min-width: 0;
}
.orientation-admin-flow {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.orientation-admin-flow span {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 999px;
    color: #344054;
    display: inline-flex;
    font-size: 13px;
    font-weight: 750;
    gap: 8px;
    padding: 8px 12px;
}
.orientation-admin-flow i {
    color: #2e6bfb;
}
.orientation-template-form .form-label {
    color: #344054;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 5px;
}
.orientation-template-form .form-label span {
    color: #667085;
    font-weight: 500;
}
.orientation-template-form {
    padding: 16px 18px 18px;
}
.orientation-template-editor {
    margin-top: 0;
}
.orientation-template-toolbar {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 12px;
}
.orientation-template-title {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.orientation-template-title .stat-icon {
    border-radius: 14px;
    flex: 0 0 46px;
    font-size: 19px;
    height: 46px;
    width: 46px;
}
.orientation-template-title h2 {
    color: var(--ink);
    font-size: 21px;
    font-weight: 650;
    letter-spacing: 0;
    margin: 2px 0 2px;
}
.orientation-template-title p {
    color: var(--muted);
    font-size: 13px;
    font-weight: 500;
    margin: 0;
}
.orientation-template-form .form-control,
.orientation-template-form .form-select,
.orientation-template-form .input-group-text {
    border-radius: 10px;
    font-size: 13px;
    min-height: 39px;
}
.orientation-template-fields textarea {
    min-height: 64px;
}
.orientation-command-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.orientation-command-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(15, 23, 42, .045);
    color: inherit;
    display: grid;
    gap: 12px;
    grid-template-columns: 48px minmax(0, 1fr) 18px;
    min-height: 118px;
    padding: 18px;
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.orientation-command-card:hover {
    border-color: #b8ccff;
    box-shadow: 0 18px 40px rgba(37, 99, 235, .12);
    color: inherit;
    transform: translateY(-2px);
}
.orientation-command-icon {
    align-items: center;
    border-radius: 15px;
    display: inline-flex;
    font-size: 21px;
    height: 48px;
    justify-content: center;
    width: 48px;
}
.orientation-command-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.orientation-command-copy small {
    color: #667085;
    font-size: 13px;
    font-weight: 750;
}
.orientation-command-copy strong {
    color: var(--ink);
    font-size: 30px;
    font-weight: 780;
    line-height: 1;
}
.orientation-command-copy em {
    color: var(--muted);
    font-size: 13px;
    font-style: normal;
    line-height: 1.35;
}
.orientation-command-arrow {
    color: #98a2b3;
    font-size: 18px;
}
.orientation-command-amber .orientation-command-icon {
    background: #fff7df;
    color: #b77900;
}
.orientation-command-blue .orientation-command-icon {
    background: #eaf1ff;
    color: #2e6bfb;
}
.orientation-command-cyan .orientation-command-icon {
    background: #e6f9ff;
    color: #0891b2;
}
.orientation-command-red .orientation-command-icon {
    background: #fff1f2;
    color: #e11d48;
}
.orientation-command-completion {
    grid-column: 1 / -1;
    grid-template-columns: 48px minmax(220px, .35fr) minmax(260px, 1fr);
    min-height: 104px;
}
.orientation-command-completion .orientation-command-icon {
    background: #ecfdf3;
    color: #198754;
}
.orientation-command-progress {
    align-items: center;
    display: flex;
    min-width: 0;
}
.orientation-command-progress .summary-meter {
    width: 100%;
}
.orientation-admin-action-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.orientation-admin-action-panel {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 100%;
    padding: 20px;
}
.orientation-action-head {
    align-items: center;
    display: flex;
    gap: 12px;
}
.orientation-action-icon {
    align-items: center;
    border-radius: 15px;
    display: inline-flex;
    flex: 0 0 48px;
    font-size: 21px;
    height: 48px;
    justify-content: center;
    width: 48px;
}
.orientation-action-icon-blue {
    background: #eaf1ff;
    color: #2e6bfb;
}
.orientation-action-icon-red {
    background: #fff1f2;
    color: #e11d48;
}
.orientation-action-head h2,
.orientation-recent-head h2 {
    color: var(--ink);
    font-size: 21px;
    font-weight: 760;
    letter-spacing: -.01em;
    line-height: 1.15;
    margin: 0;
}
.orientation-action-head p,
.orientation-recent-head p {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.35;
    margin: 4px 0 0;
}
.orientation-action-list {
    display: grid;
    gap: 10px;
}
.orientation-action-row {
    align-items: center;
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 16px;
    color: inherit;
    display: grid;
    gap: 12px;
    grid-template-columns: 42px minmax(0, 1fr) auto 18px;
    min-height: 74px;
    padding: 12px 14px;
    text-decoration: none;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.orientation-action-row:hover {
    background: #fff;
    border-color: #b8ccff;
    box-shadow: 0 14px 30px rgba(37, 99, 235, .10);
    color: inherit;
    transform: translateY(-1px);
}
.orientation-action-row .avatar {
    height: 42px;
    width: 42px;
}
.orientation-action-person,
.orientation-action-meta {
    display: grid;
    gap: 3px;
    min-width: 0;
}
.orientation-action-person strong {
    color: var(--ink);
    font-size: 15px;
    font-weight: 760;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.orientation-action-person small,
.orientation-action-meta small {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.2;
}
.orientation-action-meta {
    text-align: right;
}
.orientation-action-meta strong {
    color: var(--ink);
    font-size: 13px;
    font-weight: 760;
    white-space: nowrap;
}
.orientation-action-meta-danger strong {
    color: #e11d48;
}
.orientation-action-row > i {
    color: #98a2b3;
}
.orientation-mini-empty {
    align-items: center;
    background: #f8fafc;
    border: 1px dashed #d6deea;
    border-radius: 16px;
    color: var(--muted);
    display: flex;
    gap: 10px;
    min-height: 74px;
    padding: 14px;
}
.orientation-mini-empty i {
    color: #2e6bfb;
    font-size: 18px;
}
.orientation-recent-panel {
    padding: 20px;
}
.orientation-recent-head {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 14px;
}
.orientation-recent-head a {
    color: #2e6bfb;
    font-size: 14px;
    font-weight: 760;
    text-decoration: none;
    white-space: nowrap;
}
.orientation-recent-list {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.orientation-recent-chip {
    align-items: center;
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 16px;
    color: inherit;
    display: grid;
    gap: 12px;
    grid-template-columns: 42px minmax(0, 1fr) 18px;
    min-height: 70px;
    padding: 12px;
    text-decoration: none;
}
.orientation-recent-chip:hover {
    border-color: #b8ccff;
    color: inherit;
}
.orientation-recent-chip .avatar {
    height: 42px;
    width: 42px;
}
.orientation-recent-chip strong,
.orientation-recent-chip small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.orientation-recent-chip strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 760;
}
.orientation-recent-chip small {
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
}
.orientation-recent-chip > i {
    color: #198754;
}
.orientation-summary-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
}
.orientation-summary-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    color: inherit;
    min-height: 96px;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.orientation-summary-card:hover {
    color: inherit;
    border-color: #b8ccff;
    box-shadow: 0 14px 32px rgba(37, 99, 235, .10);
    transform: translateY(-1px);
}
.orientation-summary-card small,
.orientation-summary-card strong {
    display: block;
}
.orientation-summary-card small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;
}
.orientation-summary-card strong {
    color: var(--ink);
    font-size: 28px;
    font-weight: 900;
    line-height: 1;
    margin-top: 4px;
}
.orientation-summary-card-wide {
    grid-column: span 2;
}
.orientation-summary-card-wide .summary-meter {
    flex: 1;
    min-width: 120px;
}
.orientation-assignment-panel {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
}
.orientation-queue-panel {
    padding: 22px;
}
.orientation-queue-head {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin-bottom: 16px;
}
.orientation-queue-head .section-heading {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.orientation-queue-head .section-icon {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    flex: 0 0 46px;
    font-size: 20px;
    height: 46px;
    justify-content: center;
    width: 46px;
}
.orientation-queue-head .section-icon-blue {
    background: #eaf1ff;
    color: #2e6bfb;
}
.orientation-queue-head h2 {
    color: var(--ink);
    font-size: 22px;
    font-weight: 760;
    letter-spacing: -.01em;
    margin: 0;
}
.orientation-queue-head p {
    color: var(--muted);
    margin: 3px 0 0;
}
.orientation-queue-count {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 14px;
    color: #2e6bfb;
    display: inline-flex;
    gap: 8px;
    padding: 10px 14px;
}
.orientation-queue-count strong {
    color: var(--ink);
    font-size: 22px;
    line-height: 1;
}
.orientation-queue-count small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    text-transform: uppercase;
}
.orientation-assignment-toolbar {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px;
    margin-bottom: 14px;
}
.orientation-select-all {
    color: #344054;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 850;
}
.orientation-select-all input,
.orientation-employee-card input {
    width: 18px;
    height: 18px;
    accent-color: var(--primary);
}
.orientation-employee-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.orientation-employee-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    display: grid;
    grid-template-columns: 20px 38px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 14px;
    cursor: pointer;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.orientation-employee-card:hover {
    border-color: #b8ccff;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .08);
    transform: translateY(-1px);
}
.orientation-employee-card strong,
.orientation-employee-card small {
    display: block;
}
.orientation-employee-card strong {
    color: var(--ink);
    font-weight: 900;
}
.orientation-employee-card small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    margin-top: 2px;
}
.orientation-template-section-head {
    border-top: 1px solid var(--line);
    padding-top: 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.orientation-template-section-head h3 {
    color: var(--ink);
    font-size: 17px;
    font-weight: 650;
    margin: 0;
}
.orientation-template-section-head p {
    color: var(--muted);
    font-size: 13px;
    font-weight: 500;
    margin: 2px 0 0;
}
.orientation-template-sections {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}
.orientation-template-section {
    background: #fff;
    border: 1px solid #dbe4f0;
    border-left: 3px solid #2e6bfb;
    border-radius: 14px;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .03);
    padding: 12px;
}
.orientation-template-section-title {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto auto;
    gap: 9px;
    align-items: end;
}
.orientation-template-section-title .stat-icon {
    border-radius: 12px;
    font-size: 16px;
    height: 38px;
    width: 38px;
}
.orientation-template-count {
    align-self: center;
    background: #f1f5ff;
    border: 1px solid #dbe7ff;
    border-radius: 999px;
    color: #2e6bfb;
    font-size: 12px;
    font-weight: 700;
    padding: 6px 10px;
    white-space: nowrap;
}
.orientation-template-section textarea {
    min-height: 86px;
    resize: vertical;
}
.learning-assignment-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.learning-assignment-layout {
    align-items: stretch;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(320px, .9fr) minmax(0, 1.1fr);
}
.learning-assignment-panel {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-top: 0;
}
.learning-employee-search {
    position: relative;
}
.learning-employee-search i {
    color: #64748b;
    left: 14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.learning-employee-search .form-control {
    border-radius: 14px;
    padding-left: 40px;
}
.learning-employee-list {
    display: grid;
    flex: 1;
    gap: 10px;
    margin-top: 14px;
    max-height: none;
    min-height: 0;
    overflow: auto;
    padding-right: 4px;
}
.learning-employee-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    cursor: pointer;
    display: grid;
    gap: 12px;
    grid-template-columns: 20px 44px minmax(0, 1fr) 20px;
    padding: 12px;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.learning-employee-card:hover,
.learning-employee-card.active {
    border-color: #b8ccff;
    box-shadow: 0 12px 28px rgba(46, 107, 251, .08);
    transform: translateY(-1px);
}
.learning-employee-card input {
    accent-color: #2e6bfb;
    height: 16px;
    width: 16px;
}
.learning-employee-card strong,
.learning-employee-card small {
    display: block;
}
.learning-employee-card strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 650;
}
.learning-employee-card small {
    color: #64748b;
    font-size: 12px;
    margin-top: 2px;
}
.learning-employee-card > i {
    color: #2e6bfb;
    opacity: 0;
}
.learning-employee-card.active > i {
    opacity: 1;
}
.learning-assignment-form {
    display: grid;
    flex: 1;
    gap: 16px;
}
.learning-assignment-form .form-label {
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
}
.learning-assignment-form .form-control,
.learning-assignment-form .form-select {
    border-color: #dbe3ef;
    border-radius: 12px;
    min-height: 44px;
}
.learning-selected-employee {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbeafe;
    border-radius: 16px;
    display: flex;
    gap: 12px;
    padding: 14px;
}
.learning-selected-employee small,
.learning-selected-employee strong {
    display: block;
}
.learning-selected-employee small {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}
.learning-selected-employee strong {
    color: #060a3d;
    font-size: 16px;
    font-weight: 650;
}
.learning-type-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.learning-type-grid span {
    align-items: center;
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: #475569;
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    padding: 10px 12px;
}
.learning-type-grid i {
    color: #2e6bfb;
}
.learning-assignment-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: auto;
}
.learning-assignment-recent {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.learning-assignment-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: grid;
    gap: 14px;
    grid-template-columns: 52px minmax(260px, 1fr) minmax(120px, .3fr) minmax(100px, .25fr) auto;
    padding: 14px;
}
.learning-assignment-row:last-child {
    border-bottom: 0;
}
.learning-assignment-row strong,
.learning-assignment-row small {
    display: block;
}
.learning-assignment-row strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 650;
}
.learning-assignment-row small {
    color: #64748b;
    font-size: 12px;
    font-weight: 600;
}
.latest-review {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 18px;
    text-align: center;
}
.latest-review p {
    color: var(--muted);
    margin: 14px 0 18px;
}
.team-suggestion-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 14px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
}
.team-suggestion-card strong, .team-suggestion-card small {
    display: block;
}
.team-suggestion-card small, .team-suggestion-card p {
    color: var(--muted);
}
.team-suggestion-card p {
    margin: 4px 0 0;
}
.idea-meter {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 16px;
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    align-items: center;
}
.suggestion-board {
    padding: 22px;
}
.suggestion-board-primary {
    border-top: 4px solid var(--primary);
}
.suggestion-board-shared {
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    border-top: 4px solid #198754;
}
.suggestion-board-header,
.suggestion-section-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
    margin-bottom: 16px;
}
.suggestion-section-header .section-label {
    display: inline-block;
    margin-bottom: 6px;
}
.suggestion-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.admin-suggestion-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 18px;
}
.suggestion-summary-card {
    min-height: 92px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    color: inherit;
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.suggestion-summary-card:hover,
.suggestion-summary-card:focus {
    border-color: #b8ccff;
    background: linear-gradient(180deg, #f6f9ff 0%, #eef4ff 100%);
    color: inherit;
    box-shadow: 0 14px 32px rgba(37, 99, 235, .10);
    transform: translateY(-1px);
}
.suggestion-summary-card:focus {
    outline: 3px solid rgba(37, 99, 235, .16);
    outline-offset: 2px;
}
.suggestion-summary-card small,
.suggestion-summary-card strong {
    display: block;
}
.suggestion-summary-card small {
    color: var(--muted);
    font-size: 13px;
    font-weight: 850;
    line-height: 1.2;
}
.suggestion-summary-card strong {
    color: var(--ink);
    font-size: 28px;
    font-weight: 900;
    line-height: 1;
    margin-top: 4px;
}
.suggestion-summary-arrow {
    color: #94a3b8;
    font-size: 24px;
    margin-left: auto;
    transition: color .18s ease, transform .18s ease;
}
.suggestion-summary-card:hover .suggestion-summary-arrow,
.suggestion-summary-card:focus .suggestion-summary-arrow {
    color: var(--primary);
    transform: translateX(2px);
}
.shared-suggestion-grid {
    display: grid;
    gap: 12px;
}
.shared-suggestion-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 16px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .03);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.shared-suggestion-card:hover {
    border-color: #cbd5e1;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .055);
    transform: translateY(-1px);
}
.shared-suggestion-main {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 13px;
    align-items: flex-start;
}
.shared-suggestion-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.shared-suggestion-title-row h3 {
    color: var(--ink);
    font-size: 17px;
    font-weight: 900;
    line-height: 1.35;
    margin: 0;
}
.shared-suggestion-card p {
    color: var(--muted);
    margin: 5px 0 0;
    line-height: 1.5;
}
.shared-suggestion-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-top: 10px;
}
.shared-suggestion-meta span {
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 750;
}
.shared-suggestion-meta i {
    color: var(--primary);
}
.shared-suggestion-footer {
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    padding-top: 14px;
}
.suggestion-assignment-pill {
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 850;
    padding: 6px 10px;
    white-space: nowrap;
}
.suggestion-assignment-pill.waiting-assignment {
    background: #fff7e6;
    color: #a15c00;
}
.suggestion-assignment-pill.assigned {
    background: #eef4ff;
    color: var(--primary);
}
.suggestion-assignment-pill.in-progress {
    background: #ffc107;
    color: #111827;
}
.suggestion-assignment-pill.completed {
    background: #ecfdf3;
    color: #027a48;
}
.suggestion-assignment-pill.awaiting-review {
    background: #fff7e6;
    color: #a15c00;
}
.suggestion-assignment-pill.closed {
    background: #f1f5f9;
    color: #64748b;
}
.suggestion-admin-note {
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    min-width: 0;
}
.suggestion-admin-note i {
    color: var(--primary);
}
.suggestion-admin-note.muted {
    color: var(--muted);
}
.suggestion-table-wrap {
    border-top: 1px solid var(--line);
}
.suggestion-table {
    min-width: 980px;
}
.suggestion-table thead th {
    border-bottom: 1px solid var(--line);
    color: #111827;
    font-size: 13px;
    font-weight: 900;
    padding: 14px 12px;
    white-space: nowrap;
}
.suggestion-table tbody td {
    border-bottom: 1px solid var(--line);
    padding: 15px 12px;
    vertical-align: middle;
}
.suggestion-table tbody tr:hover {
    background: #fbfcff;
}
.suggestion-title-cell {
    min-width: 340px;
}
.suggestion-title-cell strong,
.suggestion-title-cell span {
    display: block;
}
.suggestion-title-cell strong {
    color: var(--ink);
    font-weight: 900;
    line-height: 1.35;
}
.suggestion-title-cell span {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
    margin-top: 3px;
}
.suggestion-date-cell,
.suggestion-feedback-cell {
    color: #475569;
    font-size: 13px;
    font-weight: 700;
}
.suggestion-feedback-cell {
    max-width: 260px;
}
.team-project-summary-icon-purple {
    background: #ede9fe;
    color: #7c3aed;
}
.suggestion-hero {
    align-items: center;
    background: linear-gradient(135deg, #eff6ff 0%, #ffffff 52%, #ecfdf3 100%);
    border-color: #cfe0ff;
    display: grid;
    gap: 28px;
    grid-template-columns: 180px minmax(0, 1fr) 260px;
    overflow: hidden;
    padding: 28px 34px;
    position: relative;
}
.suggestion-hero::before {
    background: radial-gradient(circle, rgba(46, 107, 251, .18), transparent 60%);
    content: "";
    height: 260px;
    position: absolute;
    right: -80px;
    top: -100px;
    width: 260px;
}
.suggestion-hero-visual {
    min-height: 160px;
    position: relative;
}
.suggestion-hero-visual::before {
    background: linear-gradient(180deg, rgba(46, 107, 251, .16), rgba(46, 107, 251, 0));
    border-radius: 999px;
    bottom: 6px;
    content: "";
    height: 24px;
    left: 42px;
    position: absolute;
    width: 112px;
}
.suggestion-hero-box {
    background: linear-gradient(145deg, #ffe07a 0%, #ffbd2f 62%, #f59e0b 100%);
    border-radius: 30px;
    box-shadow: 0 24px 42px rgba(245, 158, 11, .24);
    color: #fff;
    display: grid;
    font-size: 72px;
    height: 140px;
    left: 16px;
    place-items: center;
    position: absolute;
    top: 12px;
    transform: rotate(-8deg);
    width: 140px;
}
.suggestion-hero-box::after {
    background: rgba(255, 255, 255, .64);
    border-radius: 999px;
    bottom: -14px;
    content: "";
    height: 28px;
    left: 30px;
    position: absolute;
    transform: rotate(8deg);
    width: 92px;
}
.suggestion-hero-box i {
    filter: drop-shadow(0 10px 16px rgba(124, 74, 3, .14));
}
.suggestion-hero-spark {
    color: #2e6bfb;
    font-size: 22px;
    position: absolute;
}
.suggestion-hero-spark-one {
    color: #f59e0b;
    right: 18px;
    top: 10px;
}
.suggestion-hero-spark-two {
    left: 0;
    top: 66px;
}
.suggestion-hero-spark-three {
    bottom: 10px;
    color: #16a34a;
    right: 14px;
}
.suggestion-hero-copy h2 {
    color: #060a3d;
    font-size: 26px;
    line-height: 1.2;
    margin: 8px 0 12px;
}
.suggestion-hero-copy h2 span {
    color: #2e6bfb;
}
.suggestion-hero-copy p {
    color: #526174;
    line-height: 1.6;
    margin: 0;
    max-width: 620px;
}
.suggestion-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 20px;
}
.suggestion-approved-score-card {
    align-items: center;
    background: rgba(255, 255, 255, .86);
    border: 1px solid #dbe7ff;
    border-radius: 18px;
    box-shadow: 0 18px 36px rgba(15, 23, 42, .06);
    display: flex;
    gap: 14px;
    padding: 18px;
    position: relative;
    z-index: 1;
}
.suggestion-approved-score-icon {
    align-items: center;
    background: #ecfdf5;
    border-radius: 15px;
    color: #159760;
    display: inline-flex;
    flex: 0 0 54px;
    font-size: 26px;
    height: 54px;
    justify-content: center;
}
.suggestion-approved-score-card small {
    color: #64748b;
    display: block;
    font-size: 13px;
    font-weight: 650;
    margin-bottom: 2px;
}
.suggestion-approved-score-card strong {
    color: #060a3d;
    display: block;
    font-size: 34px;
    font-weight: 760;
    line-height: 1;
    margin-bottom: 6px;
}
.suggestion-approved-score-card p {
    color: #526174;
    font-size: 13px;
    line-height: 1.35;
    margin: 0;
}
.suggestion-hero-points {
    display: grid;
    gap: 16px;
    position: relative;
    z-index: 1;
}
.suggestion-hero-points div {
    align-items: center;
    display: grid;
    gap: 3px 12px;
    grid-template-columns: 44px minmax(0, 1fr);
}
.suggestion-point-icon {
    border-radius: 50%;
    display: grid;
    font-size: 20px;
    grid-row: span 2;
    height: 44px;
    place-items: center;
    width: 44px;
}
.suggestion-point-blue {
    background: #e9efff;
    color: #2e6bfb;
}
.suggestion-point-green {
    background: #dcfce7;
    color: #16a34a;
}
.suggestion-point-amber {
    background: #ffedd5;
    color: #f59e0b;
}
.suggestion-hero-points strong {
    color: #060a3d;
    font-size: 14px;
}
.suggestion-hero-points small {
    color: #526174;
}
.suggestion-summary-shell {
    padding: 20px;
}
.suggestion-summary-grid-lively {
    gap: 0;
}
.suggestion-summary-card-lively {
    border-radius: 0;
    border-width: 0;
    border-right: 1px solid var(--line);
    box-shadow: none;
    min-height: 112px;
}
.suggestion-summary-card-lively:first-child {
    border-bottom-left-radius: 14px;
    border-top-left-radius: 14px;
}
.suggestion-summary-card-lively:last-child {
    border-bottom-right-radius: 14px;
    border-right: 0;
    border-top-right-radius: 14px;
}
.suggestion-summary-content em {
    align-items: center;
    color: #526174;
    display: flex;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    gap: 7px;
    margin-top: 10px;
}
.suggestion-summary-content em i {
    color: #2e6bfb;
    font-size: 7px;
}
.suggestion-table-wrap-lively {
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
}
.suggestion-table-lively thead th {
    background: #fbfcff;
}
.suggestion-title-cell-lively {
    align-items: center;
    display: flex;
    gap: 12px;
}
.suggestion-title-cell-lively > span:last-child {
    min-width: 0;
}
.suggestion-title-cell-lively small {
    color: var(--muted);
    display: block;
    font-size: 13px;
    line-height: 1.45;
    margin-top: 3px;
}
.suggestion-row-icon {
    background: #e9efff;
    border-radius: 12px;
    color: #2e6bfb;
    display: grid;
    flex: 0 0 auto;
    font-size: 20px;
    height: 42px;
    place-items: center;
    width: 42px;
}
.shared-suggestion-grid-lively {
    gap: 14px;
}
.shared-suggestion-card-lively {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) 240px;
}
.shared-suggestion-card-lively .shared-suggestion-footer {
    grid-column: 1 / -1;
}
.shared-suggestion-celebrate {
    align-self: stretch;
    background: linear-gradient(135deg, #fff7ed, #ffffff);
    border: 1px solid #fed7aa;
    border-radius: 14px;
    display: grid;
    gap: 6px;
    justify-items: center;
    padding: 16px;
    text-align: center;
}
.shared-suggestion-celebrate span {
    color: #f97316;
    font-size: 34px;
    line-height: 1;
}
.shared-suggestion-celebrate strong {
    color: #060a3d;
}
.shared-suggestion-celebrate small {
    color: #526174;
    line-height: 1.45;
}
.suggestion-celebration-strip {
    align-items: center;
    background: linear-gradient(135deg, #ecfdf3, #ffffff);
    border-color: #bbf7d0;
    display: grid;
    gap: 22px;
    grid-template-columns: 84px minmax(0, 1fr) 170px 170px;
    padding: 20px 26px;
}
.suggestion-celebration-icon {
    background: #fff7ed;
    border-radius: 18px;
    color: #f59e0b;
    display: grid;
    font-size: 44px;
    height: 76px;
    place-items: center;
    width: 76px;
}
.suggestion-celebration-strip h2 {
    color: #060a3d;
    font-size: 18px;
    margin: 0 0 6px;
}
.suggestion-celebration-strip p {
    color: #526174;
    margin: 0;
}
.suggestion-celebration-stats {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
    text-align: center;
}
.suggestion-celebration-stats strong {
    color: #2e6bfb;
    display: block;
    font-size: 30px;
    line-height: 1;
}
.suggestion-celebration-stats small {
    color: #526174;
    display: block;
    font-size: 13px;
    margin-top: 6px;
}
.admin-suggestion-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 1.5fr) minmax(150px, .55fr) minmax(180px, .65fr) auto auto;
    gap: 10px;
    margin-bottom: 16px;
}
.admin-suggestion-table {
    min-width: 1080px;
}
.admin-suggestion-note {
    color: #475569;
    display: block;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    margin-top: 6px;
}
.admin-suggestion-note i {
    color: var(--primary);
    margin-right: 5px;
}
.suggestion-category-pill {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fbfcff;
    color: #475569;
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 850;
    white-space: nowrap;
}
.suggestion-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 390px;
    gap: 18px;
    align-items: start;
}
.suggestion-detail-main,
.suggestion-review-panel,
.suggestion-assignment-panel {
    padding: 22px;
}
.suggestion-detail-hero {
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 18px;
    margin-bottom: 16px;
}
.suggestion-detail-hero h2 {
    color: var(--ink);
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 900;
    line-height: 1.12;
    margin: 4px 0 8px;
}
.suggestion-detail-badges {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}
.suggestion-author-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    margin-bottom: 14px;
}
.suggestion-author-card strong,
.suggestion-author-card small {
    display: block;
}
.suggestion-author-card strong {
    color: var(--ink);
    font-size: 15px;
    font-weight: 900;
}
.suggestion-author-card small {
    color: var(--muted);
    font-weight: 700;
}
.suggestion-copy-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 16px;
    margin-top: 14px;
}
.suggestion-copy-card h3 {
    color: var(--ink);
    font-size: 16px;
    font-weight: 900;
    margin-bottom: 8px;
}
.suggestion-copy-card p {
    color: #475569;
    line-height: 1.6;
    margin: 0;
}
.suggestion-detail-list {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    grid-template-columns: 130px 1fr;
    padding: 14px;
}
.suggestion-action-form {
    border-top: 1px solid var(--line);
    margin-top: 16px;
    padding-top: 16px;
}
.suggestion-action-form .form-label,
.suggestion-assignment-card .form-label {
    color: var(--ink);
    font-size: 13px;
    font-weight: 850;
}
.suggestion-assignment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}
.suggestion-assignment-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 18px;
}
.suggestion-assignment-card h3 {
    color: var(--ink);
    font-size: 18px;
    font-weight: 900;
    margin: 14px 0 12px;
}
.suggestion-form-panel {
    padding: 22px;
}
.suggestion-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 18px;
    align-items: start;
}
.suggestion-form-main {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 18px;
}
.suggestion-form-main .form-label {
    color: var(--ink);
    font-size: 13px;
    font-weight: 850;
}
.suggestion-form-main .form-label span {
    color: #dc3545;
}
.suggestion-benefit-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.suggestion-benefit-strip span {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 38px;
    padding: 8px 11px;
    font-size: 13px;
    font-weight: 800;
}
.suggestion-benefit-strip i {
    color: var(--primary);
}
.suggestion-guidance-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    padding: 18px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
}
.suggestion-guidance-card h3 {
    color: var(--ink);
    font-size: 18px;
    font-weight: 900;
    margin: 14px 0 10px;
}
.suggestion-guidance-card ul {
    display: grid;
    gap: 10px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.suggestion-guidance-card li {
    color: #475569;
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}
.suggestion-guidance-card li i {
    color: #198754;
    margin-top: 2px;
}
.suggestion-submit-panel {
    padding: 22px 24px 0;
}
.suggestion-submit-head {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 14px;
    padding-bottom: 18px;
}
.suggestion-submit-head-icon {
    align-items: center;
    background: #eef5ff;
    border-radius: 14px;
    color: var(--primary);
    display: inline-flex;
    flex: 0 0 58px;
    font-size: 28px;
    height: 58px;
    justify-content: center;
}
.suggestion-submit-head-copy {
    flex: 1;
    min-width: 0;
}
.suggestion-submit-head-copy h2 {
    color: var(--ink);
    font-size: 21px;
    font-weight: 750;
    margin: 0 0 4px;
}
.suggestion-submit-head-copy p {
    color: var(--muted);
    font-size: 15px;
    line-height: 1.45;
    margin: 0;
}
.suggestion-submit-back {
    border-radius: 10px;
    min-width: 96px;
}
.suggestion-submit-layout {
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(0, 1fr) 360px;
    padding: 22px 0 18px;
}
.suggestion-submit-form-card {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    padding: 18px;
}
.suggestion-submit-stack {
    display: grid;
    gap: 18px;
}
.suggestion-submit-two-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.suggestion-submit-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.suggestion-submit-field {
    min-width: 0;
}
.suggestion-submit-title {
    grid-column: 1 / -1;
}
.suggestion-submit-field .form-label {
    align-items: center;
    color: var(--ink);
    display: flex;
    gap: 7px;
    font-size: 13px;
    font-weight: 720;
    margin-bottom: 8px;
}
.suggestion-submit-field .form-label span:not(.muted) {
    color: #dc3545;
}
.suggestion-submit-field .form-label .muted,
.suggestion-submit-field .form-label small {
    color: var(--muted);
    font-size: 13px;
    font-weight: 500;
}
.suggestion-submit-field .form-label i {
    color: #64748b;
    font-size: 15px;
}
.suggestion-submit-field .form-control,
.suggestion-submit-field .form-select,
.suggestion-cost-input .input-group-text {
    border-color: #dbe3ef;
    border-radius: 10px;
    color: var(--ink);
    min-height: 50px;
}
.suggestion-cost-input .input-group-text {
    background: #f8fafc;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    color: #64748b;
    font-weight: 700;
}
.suggestion-cost-input .form-control {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}
.suggestion-submit-cost {
    grid-column: span 1;
}
.suggestion-submit-benefits {
    grid-column: 1 / -1;
}
.suggestion-benefit-options {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.suggestion-benefit-chip {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 11px;
    color: #2e6bfb;
    cursor: pointer;
    display: inline-flex;
    gap: 8px;
    justify-content: flex-start;
    min-height: 50px;
    min-width: 0;
    padding: 10px 10px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    user-select: none;
    width: 100%;
}
.suggestion-benefit-chip:hover,
.suggestion-benefit-chip.is-selected {
    background: #eef5ff;
    box-shadow: 0 12px 24px rgba(46, 107, 251, .1);
    transform: translateY(-1px);
}
.suggestion-benefit-chip i {
    color: #2e6bfb;
    flex: 0 0 auto;
    font-size: 18px;
}
.suggestion-benefit-chip span {
    color: var(--ink);
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.2;
    min-width: 0;
    white-space: normal;
}
.suggestion-benefit-green {
    background: #f8fbff;
    border-color: #dbe7ff;
    color: #2e6bfb;
}
.suggestion-benefit-blue {
    background: #f8fbff;
    border-color: #dbe7ff;
    color: #2e6bfb;
}
.suggestion-benefit-orange {
    background: #f8fbff;
    border-color: #dbe7ff;
    color: #2e6bfb;
}
.suggestion-benefit-purple {
    background: #f8fbff;
    border-color: #dbe7ff;
    color: #2e6bfb;
}
.suggestion-benefit-chip.is-selected {
    border-color: #2e6bfb;
    box-shadow: 0 12px 26px rgba(46, 107, 251, .14);
}
.suggestion-submit-details,
.suggestion-submit-media,
.suggestion-submit-tip {
    grid-column: 1 / -1;
}
.suggestion-media-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.suggestion-media-upload {
    align-items: center;
    background: #f8fbff;
    border: 1px dashed #bcd2ff;
    border-radius: 14px;
    color: var(--ink);
    cursor: pointer;
    display: grid;
    gap: 5px;
    grid-template-columns: 46px minmax(0, 1fr);
    padding: 14px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.suggestion-media-upload:hover {
    border-color: #2e6bfb;
    box-shadow: 0 12px 28px rgba(46, 107, 251, .1);
    transform: translateY(-1px);
}
.suggestion-media-upload > span {
    align-items: center;
    background: #eef5ff;
    border-radius: 13px;
    color: #2e6bfb;
    display: inline-flex;
    font-size: 22px;
    grid-row: span 2;
    height: 46px;
    justify-content: center;
    width: 46px;
}
.suggestion-media-upload strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 680;
    line-height: 1.2;
}
.suggestion-media-upload small {
    color: #64748b;
    font-size: 12px;
    line-height: 1.3;
}
.suggestion-media-upload input {
    grid-column: 1 / -1;
    margin-top: 8px;
    max-width: 100%;
}
.suggestion-textarea-wrap {
    position: relative;
}
.suggestion-textarea-wrap textarea {
    min-height: 168px;
    padding-bottom: 36px;
    resize: vertical;
}
.suggestion-character-count {
    bottom: 12px;
    color: #64748b;
    font-size: 13px;
    position: absolute;
    right: 18px;
}
.suggestion-submit-tip {
    align-items: flex-start;
    background: #eef5ff;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    display: flex;
    gap: 12px;
    padding: 13px 15px;
}
.suggestion-submit-tip span {
    align-items: center;
    background: var(--primary);
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    flex: 0 0 30px;
    height: 30px;
    justify-content: center;
}
.suggestion-submit-tip strong {
    color: var(--ink);
    display: block;
    font-size: 14px;
    font-weight: 740;
    margin-bottom: 3px;
}
.suggestion-submit-tip p {
    color: #475569;
    font-size: 13px;
    margin: 0;
}
.suggestion-submit-side {
    align-self: stretch;
    background: linear-gradient(145deg, #ffffff 0%, #f7fbff 100%);
    border: 1px solid #dbe3ef;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    justify-content: space-between;
    padding: 18px;
}
.suggestion-submit-illustration {
    height: 150px;
    position: relative;
}
.suggestion-submit-bulb,
.suggestion-submit-box {
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
}
.suggestion-submit-bulb {
    align-items: center;
    background: linear-gradient(180deg, #ffd85a 0%, #ffb703 100%);
    border-radius: 50%;
    box-shadow: 0 16px 34px rgba(255, 183, 3, .24);
    color: #7c4a03;
    display: inline-flex;
    font-size: 38px;
    height: 78px;
    justify-content: center;
    top: 6px;
    width: 78px;
    z-index: 2;
}
.suggestion-submit-box {
    align-items: center;
    background: linear-gradient(145deg, #e8f1ff 0%, #2e6bfb 100%);
    border-radius: 20px 20px 24px 24px;
    bottom: 10px;
    color: #fff;
    display: inline-flex;
    font-size: 76px;
    height: 78px;
    justify-content: center;
    opacity: .95;
    width: 122px;
}
.suggestion-submit-spark {
    background: #ffb703;
    border-radius: 999px;
    display: block;
    height: 8px;
    position: absolute;
    width: 8px;
}
.suggestion-submit-spark-one {
    left: 28%;
    top: 34px;
}
.suggestion-submit-spark-two {
    right: 24%;
    top: 58px;
}
.suggestion-submit-spark-three {
    left: 20%;
    top: 98px;
}
.suggestion-submit-side h3 {
    color: var(--ink);
    font-size: 17px;
    font-weight: 750;
    margin: 0;
}
.suggestion-submit-checklist {
    display: grid;
    gap: 12px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.suggestion-submit-checklist li {
    align-items: flex-start;
    color: #475569;
    display: flex;
    font-size: 14px;
    gap: 9px;
    line-height: 1.45;
}
.suggestion-submit-checklist li i {
    color: #159760;
    margin-top: 2px;
}
.suggestion-submit-callout {
    align-items: center;
    background: #ecfdf5;
    border: 1px solid #d1fae5;
    border-radius: 13px;
    display: flex;
    gap: 12px;
    margin-top: 0;
    padding: 14px;
}
.suggestion-submit-callout > span {
    align-items: center;
    background: #42c981;
    border-radius: 50%;
    color: #fff;
    display: inline-flex;
    flex: 0 0 44px;
    font-size: 20px;
    height: 44px;
    justify-content: center;
}
.suggestion-submit-callout strong {
    color: #08734e;
    display: block;
    font-size: 14px;
    font-weight: 780;
    margin-bottom: 3px;
}
.suggestion-submit-callout p {
    color: #475569;
    font-size: 13px;
    line-height: 1.4;
    margin: 0;
}
.suggestion-submit-footer {
    align-items: center;
    border-top: 1px solid var(--line);
    display: grid;
    gap: 16px;
    grid-template-columns: 160px 1fr 250px;
    padding: 18px 0 22px;
}
.suggestion-submit-footer p {
    align-items: center;
    color: var(--muted);
    display: flex;
    font-size: 14px;
    gap: 8px;
    justify-content: center;
    margin: 0;
}
.suggestion-submit-footer p i {
    color: var(--primary);
}
.suggestion-submit-cancel,
.suggestion-submit-button {
    border-radius: 10px;
    min-height: 50px;
}
.ideas-page-header {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin-bottom: 22px;
}
.ideas-page-title {
    align-items: center;
    display: flex;
    gap: 16px;
}
.ideas-title-icon {
    align-items: center;
    background: #fff7e8;
    border: 1px solid #ffedd5;
    border-radius: 18px;
    color: #f59e0b;
    display: inline-flex;
    flex: 0 0 64px;
    font-size: 34px;
    height: 64px;
    justify-content: center;
}
.ideas-page-title h2 {
    color: #060a3d;
    font-size: 34px;
    font-weight: 760;
    letter-spacing: 0;
    line-height: 1.15;
    margin: 0 0 6px;
}
.ideas-page-title p {
    color: #526174;
    font-size: 15px;
    margin: 0;
}
.ideas-new-button {
    align-items: center;
    border-radius: 12px;
    box-shadow: 0 14px 28px rgba(37, 99, 235, .18);
    display: inline-flex;
    justify-content: center;
    min-height: 48px;
    min-width: 142px;
    text-align: center;
}
.ideas-kpi-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 20px;
}
.ideas-kpi-card {
    align-items: center;
    background: #fff;
    border: 1px solid #dfe6f2;
    border-radius: 16px;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .035);
    display: grid;
    gap: 14px;
    grid-template-columns: 58px minmax(0, 1fr) 24px;
    min-height: 120px;
    padding: 18px 20px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.ideas-kpi-card:hover,
.ideas-kpi-card:focus {
    border-color: #b8ccff;
    box-shadow: 0 18px 36px rgba(15, 23, 42, .07);
    transform: translateY(-1px);
}
.ideas-kpi-icon {
    align-items: center;
    border-radius: 16px;
    display: inline-flex;
    font-size: 27px;
    height: 58px;
    justify-content: center;
    width: 58px;
}
.ideas-kpi-icon-blue {
    background: #eef5ff;
    color: #2e6bfb;
}
.ideas-kpi-icon-amber {
    background: #fff4db;
    color: #d97706;
}
.ideas-kpi-icon-green {
    background: #e8f8ef;
    color: #159760;
}
.ideas-kpi-copy small,
.ideas-kpi-copy em {
    color: #526174;
    display: block;
    font-size: 13px;
    font-style: normal;
}
.ideas-kpi-copy strong {
    color: #2e6bfb;
    display: block;
    font-size: 28px;
    font-weight: 760;
    line-height: 1.1;
    margin: 3px 0;
}
.ideas-kpi-arrow {
    color: #64748b;
    font-size: 20px;
}
.ideas-approved-marquee {
    background: linear-gradient(180deg, rgba(22, 163, 74, .055), #fff 74%);
    border-top: 4px solid #16a34a;
    margin-bottom: 16px;
    overflow: hidden;
    padding: 20px 0;
}
.ideas-approved-marquee-head {
    align-items: center;
    display: flex;
    gap: 14px;
    margin: 0 22px 16px;
}
.ideas-approved-marquee-head h2 {
    color: #060a3d;
    font-size: 20px;
    font-weight: 760;
    line-height: 1.2;
    margin: 0;
}
.ideas-approved-marquee-head p {
    color: #526174;
    margin: 4px 0 0;
}
.ideas-approved-marquee-window {
    overflow: hidden;
    position: relative;
}
.ideas-approved-marquee-window::before,
.ideas-approved-marquee-window::after {
    content: "";
    bottom: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 46px;
    z-index: 2;
}
.ideas-approved-marquee-window::before {
    background: linear-gradient(90deg, #fff, rgba(255, 255, 255, 0));
    left: 0;
}
.ideas-approved-marquee-window::after {
    background: linear-gradient(270deg, #fff, rgba(255, 255, 255, 0));
    right: 0;
}
.ideas-approved-marquee-track {
    animation: ideasApprovedMarquee 32s linear infinite;
    display: flex;
    gap: 14px;
    padding: 0 22px;
    width: max-content;
}
.ideas-approved-marquee:hover .ideas-approved-marquee-track {
    animation-play-state: paused;
}
.ideas-approved-marquee-card {
    align-items: center;
    background: #fff;
    border: 1px solid #d6f3df;
    border-radius: 16px;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .045);
    display: grid;
    gap: 12px;
    grid-template-columns: 52px minmax(0, 1fr);
    min-height: 104px;
    padding: 14px;
    width: 310px;
}
.ideas-approved-marquee-photo {
    border: 2px solid #dcfce7;
    border-radius: 14px;
    height: 52px;
    object-fit: cover;
    width: 52px;
}
.ideas-approved-marquee-photo-fallback {
    align-items: center;
    background: #dcfce7;
    color: #08734e;
    display: inline-flex;
    font-size: 14px;
    font-weight: 760;
    justify-content: center;
}
.ideas-approved-marquee-copy {
    min-width: 0;
}
.ideas-approved-marquee-copy strong,
.ideas-approved-marquee-copy span,
.ideas-approved-marquee-copy small {
    display: block;
}
.ideas-approved-marquee-copy strong {
    color: #060a3d;
    font-size: 15px;
    font-weight: 760;
    line-height: 1.3;
}
.ideas-approved-marquee-copy span {
    color: #334155;
    font-size: 13px;
    font-weight: 650;
    margin-top: 6px;
}
.ideas-approved-marquee-copy small {
    color: #64748b;
    font-size: 12px;
    margin-top: 2px;
}
@keyframes ideasApprovedMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
@media (prefers-reduced-motion: reduce) {
    .ideas-approved-marquee-track {
        animation: none;
        overflow-x: auto;
        width: auto;
    }
}
.ideas-accordion {
    display: grid;
    gap: 16px;
}
.ideas-section {
    overflow: hidden;
    padding: 0;
}
.ideas-section-head {
    align-items: center;
    background: #fff;
    border: 0;
    display: grid;
    gap: 13px;
    grid-template-columns: 50px minmax(0, 1fr) 24px;
    padding: 20px 22px;
    text-align: left;
    width: 100%;
}
.ideas-section-head strong {
    color: #060a3d;
    display: block;
    font-size: 19px;
    font-weight: 760;
    line-height: 1.25;
}
.ideas-section-head small {
    color: #526174;
    display: block;
    font-size: 14px;
    margin-top: 2px;
}
.ideas-section-icon {
    align-items: center;
    border-radius: 14px;
    color: #fff;
    display: inline-flex;
    font-size: 23px;
    height: 50px;
    justify-content: center;
    width: 50px;
}
.ideas-section-icon-blue {
    background: #2e6bfb;
}
.ideas-section-icon-green {
    background: #159760;
}
.ideas-section-icon-purple {
    background: #7c3aed;
}
.ideas-section-chevron {
    color: #060a3d;
    justify-self: end;
}
.ideas-section-head.collapsed .ideas-section-chevron::before {
    content: "\f282";
}
.ideas-list {
    border-top: 1px solid #dfe6f2;
    padding: 0 14px 14px;
}
.ideas-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid #e4e9f3;
    display: grid;
    gap: 18px;
    grid-template-columns: 56px minmax(260px, 1fr) 180px 250px;
    padding: 18px 10px;
}
.ideas-row:last-child {
    border-bottom: 0;
}
.ideas-row-icon {
    align-items: center;
    border-radius: 14px;
    display: inline-flex;
    font-size: 24px;
    height: 52px;
    justify-content: center;
    width: 52px;
}
.ideas-row-icon-blue {
    background: #eef5ff;
    color: #2e6bfb;
}
.ideas-row-icon-green {
    background: #e8f8ef;
    color: #159760;
}
.ideas-row-icon-purple {
    background: #f2eaff;
    color: #7c3aed;
}
.ideas-row-main h3 {
    color: #060a3d;
    font-size: 16px;
    font-weight: 760;
    line-height: 1.3;
    margin: 0 0 6px;
}
.ideas-presenter-strip {
    align-items: center;
    color: #526174;
    display: flex;
    gap: 9px;
    margin: 8px 0 8px;
    min-width: 0;
}
.ideas-presenter-strip-compact {
    margin: 6px 0 7px;
}
.ideas-presenter-photo {
    border: 1px solid #dbe7ff;
    border-radius: 12px;
    flex: 0 0 34px;
    height: 34px;
    object-fit: cover;
    width: 34px;
}
.ideas-presenter-photo-fallback {
    align-items: center;
    background: #eef5ff;
    color: #2e6bfb;
    display: inline-flex;
    font-size: 12px;
    font-weight: 700;
    justify-content: center;
}
.ideas-presenter-strip > span:last-child {
    display: grid;
    gap: 1px;
    min-width: 0;
}
.ideas-presenter-strip strong {
    color: #060a3d;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.2;
}
.ideas-presenter-strip small {
    color: #64748b;
    font-size: 12px;
    line-height: 1.2;
}
.ideas-row-main p,
.ideas-row-feedback p,
.ideas-row-details p {
    color: #526174;
    font-size: 14px;
    line-height: 1.55;
    margin: 0;
}
.ideas-row-meta {
    align-items: center;
    color: #526174;
    display: flex;
    flex-wrap: wrap;
    font-size: 13px;
    gap: 10px 14px;
    margin-top: 11px;
}
.ideas-row-meta span {
    align-items: center;
    display: inline-flex;
    gap: 6px;
}
.ideas-row-attributes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 11px;
}
.ideas-row-attributes span {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #dbe7ff;
    border-radius: 999px;
    color: #526174;
    display: inline-flex;
    font-size: 12px;
    gap: 5px;
    line-height: 1.2;
    padding: 7px 10px;
}
.ideas-row-attributes strong {
    color: #060a3d;
    font-size: 12px;
    font-weight: 650;
}
.ideas-media-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}
.ideas-media-chips span {
    align-items: center;
    background: #eef5ff;
    border: 1px solid #dbe7ff;
    border-radius: 999px;
    color: #085bcb;
    display: inline-flex;
    font-size: 12px;
    font-weight: 650;
    gap: 5px;
    padding: 6px 10px;
}
.ideas-row-status,
.ideas-row-feedback {
    display: grid;
    gap: 8px;
}
.ideas-row-status small,
.ideas-row-feedback small {
    color: #64748b;
    font-size: 12px;
    font-weight: 680;
}
.ideas-soft-badge {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 12px;
    font-weight: 720;
    justify-content: center;
    justify-self: start;
    min-height: 28px;
    padding: 5px 11px;
}
.ideas-soft-badge-slate {
    background: #f1f5f9;
    color: #475569;
}
.ideas-soft-badge-blue {
    background: #eaf2ff;
    color: #1d4ed8;
}
.ideas-soft-badge-green {
    background: #dcfce7;
    color: #08734e;
}
.ideas-soft-badge-red {
    background: #fee2e2;
    color: #b42318;
}
.ideas-soft-badge-amber {
    background: #fff4db;
    color: #b45309;
}
.ideas-details-link {
    align-items: center;
    background: transparent;
    border: 0;
    color: #085bcb;
    display: inline-flex;
    font-size: 14px;
    font-weight: 720;
    gap: 7px;
    justify-self: start;
    padding: 0;
}
.ideas-row-details {
    background: #f8fbff;
    border: 1px dashed #d5e0f0;
    border-radius: 12px;
    grid-column: 2 / -1;
    padding: 13px 15px;
}
.ideas-row-details strong,
.ideas-row-details span {
    color: #060a3d;
    display: block;
    font-size: 13px;
    font-weight: 720;
    margin-bottom: 5px;
}
.ideas-detail-facts {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 12px;
}
.ideas-detail-facts span {
    background: #fff;
    border: 1px solid #e1e8f3;
    border-radius: 10px;
    color: #526174;
    font-weight: 500;
    margin: 0;
    padding: 10px 12px;
}
.ideas-detail-facts strong {
    color: #060a3d;
    margin-bottom: 3px;
}
.ideas-attachments-title {
    margin-top: 14px;
}
.ideas-media-view {
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1.5fr) minmax(220px, .8fr);
    margin-top: 12px;
}
.ideas-media-card {
    background: #fff;
    border: 1px solid #e1e8f3;
    border-radius: 12px;
    color: #526174;
    display: grid;
    gap: 10px;
    padding: 12px;
    text-decoration: none;
}
.ideas-media-card strong {
    align-items: center;
    color: #060a3d;
    display: inline-flex;
    font-size: 13px;
    gap: 7px;
    margin: 0;
}
.ideas-media-card video {
    background: #0f172a;
    border-radius: 10px;
    max-height: 260px;
    width: 100%;
}
.ideas-media-card small {
    color: #64748b;
    font-size: 12px;
    overflow-wrap: anywhere;
}
.ideas-media-pdf {
    align-content: center;
    min-height: 120px;
}
.ideas-media-pdf > span {
    align-items: center;
    background: #fff1f2;
    border-radius: 14px;
    color: #dc3545;
    display: inline-flex;
    font-size: 26px;
    height: 52px;
    justify-content: center;
    width: 52px;
}
.ideas-media-empty {
    align-items: center;
    background: #fff;
    border: 1px dashed #d5e0f0;
    border-radius: 12px;
    color: #64748b;
    display: flex;
    font-size: 13px;
    gap: 8px;
    margin-top: 8px;
    padding: 12px;
}
.ideas-media-empty i {
    color: #2e6bfb;
    font-size: 18px;
}
.ideas-note {
    align-items: center;
    color: #526174;
    display: flex;
    gap: 10px;
    justify-content: center;
    margin: 24px auto 0;
    max-width: 720px;
    text-align: center;
}
.ideas-note span {
    align-items: center;
    background: #fff7e8;
    border-radius: 50%;
    color: #f59e0b;
    display: inline-flex;
    flex: 0 0 34px;
    height: 34px;
    justify-content: center;
}
.ideas-note strong {
    color: #060a3d;
    display: block;
    font-size: 14px;
    font-weight: 740;
}
.ideas-note p {
    font-size: 13px;
    margin: 2px 0 0;
}
.ideas-admin-filter {
    align-items: center;
    background: #f8fbff;
    border-bottom: 1px solid #e4e9f3;
    border-top: 1px solid #e4e9f3;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(260px, 1.35fr) minmax(150px, .5fr) minmax(170px, .55fr) auto auto;
    margin: 0;
    padding: 14px;
}
.ideas-admin-filter .form-control,
.ideas-admin-filter .form-select,
.ideas-admin-filter .input-group-text {
    border-color: #dfe6f2;
    min-height: 46px;
}
.ideas-admin-filter .btn {
    min-height: 46px;
}
.ideas-admin-filter + .ideas-list {
    border-top: 0;
}
.ideas-admin-actions p {
    max-width: 260px;
}
.ideas-admin-delete {
    align-items: center;
    background: transparent;
    border: 0;
    color: #dc3545;
    display: inline-flex;
    font-size: 13px;
    font-weight: 650;
    gap: 6px;
    padding: 0;
}
.ideas-admin-delete:hover,
.ideas-admin-delete:focus {
    color: #b42318;
}
.ideas-admin-pagination {
    border-top: 1px solid #e4e9f3;
    padding: 14px 20px;
}
.admin-ideas-page-header {
    background: #fff;
    border: 1px solid #dfe6f2;
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .045);
    padding: 18px 20px;
}
.admin-ideas-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.admin-ideas-kpi-card {
    min-height: 104px;
    padding: 16px 18px;
}
.ideas-kpi-icon-purple {
    background: #f2eaff;
    color: #7c3aed;
}
.admin-ideas-board {
    gap: 18px;
    grid-template-columns: 1fr;
}
.admin-ideas-priority-grid {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.admin-ideas-section {
    border: 1px solid #dfe6f2;
    border-radius: 18px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .04);
}
.admin-ideas-section-review {
    border-top: 4px solid #2e6bfb;
}
.admin-ideas-section-approved {
    border-top: 4px solid #159760;
}
.admin-ideas-section-all {
    border-top: 4px solid #7c3aed;
}
.admin-ideas-section-head {
    cursor: pointer;
    grid-template-columns: 50px minmax(0, 1fr) 40px;
    list-style: none;
    padding: 18px 20px;
}
.admin-ideas-section-head::-webkit-details-marker {
    display: none;
}
.admin-ideas-section-head::marker {
    content: "";
}
.admin-ideas-collapse-body {
    border-top: 1px solid #e4e9f3;
}
.admin-ideas-collapse-toggle i {
    transition: transform .18s ease;
}
.admin-ideas-collapse-panel[open] .admin-ideas-collapse-toggle i {
    transform: rotate(180deg);
}
.admin-ideas-review-list,
.admin-ideas-approved-grid,
.admin-ideas-compact-list {
    display: grid;
    gap: 14px;
    padding: 16px;
}
.admin-ideas-approved-grid {
    grid-template-columns: 1fr;
}
.admin-ideas-scroll-eight {
    --admin-idea-row-height: 136px;
    max-height: calc((var(--admin-idea-row-height) * 8) + 84px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
.admin-ideas-review-list.admin-ideas-scroll-eight {
    --admin-idea-row-height: 152px;
}
.admin-ideas-approved-grid.admin-ideas-scroll-eight {
    --admin-idea-row-height: 168px;
}
.admin-ideas-compact-list.admin-ideas-scroll-eight {
    --admin-idea-row-height: 168px;
}
.admin-ideas-review-list::-webkit-scrollbar,
.admin-ideas-approved-grid::-webkit-scrollbar,
.admin-ideas-compact-list::-webkit-scrollbar {
    width: 8px;
}
.admin-ideas-review-list::-webkit-scrollbar-track,
.admin-ideas-approved-grid::-webkit-scrollbar-track,
.admin-ideas-compact-list::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 999px;
}
.admin-ideas-review-list::-webkit-scrollbar-thumb,
.admin-ideas-approved-grid::-webkit-scrollbar-thumb,
.admin-ideas-compact-list::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 999px;
}
.admin-ideas-review-list::-webkit-scrollbar-thumb:hover,
.admin-ideas-approved-grid::-webkit-scrollbar-thumb:hover,
.admin-ideas-compact-list::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}
.admin-idea-card {
    background: #fff;
    border: 1px solid #e1e8f3;
    border-radius: 16px;
    display: grid;
    gap: 16px;
    padding: 18px;
    transition: border-color .18s ease, box-shadow .18s ease;
}
.admin-idea-card:hover {
    border-color: #cddaf0;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .055);
}
.admin-idea-card-review {
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
}
.admin-idea-card-approved {
    align-content: start;
}
.admin-idea-card-approved-flat {
    align-items: stretch;
    grid-template-columns: minmax(320px, 1.05fr) minmax(190px, .55fr) minmax(220px, .7fr) minmax(260px, .75fr) minmax(132px, auto);
}
.admin-ideas-table-head {
    align-items: center;
    background: #f8fbff;
    border: 1px solid #e1e8f3;
    border-radius: 14px;
    color: #64748b;
    display: grid;
    font-size: 11px;
    font-weight: 800;
    gap: 16px;
    grid-template-columns: minmax(320px, 1.05fr) minmax(190px, .55fr) minmax(220px, .7fr) minmax(260px, .75fr) minmax(132px, auto);
    letter-spacing: .02em;
    padding: 11px 18px;
    text-transform: uppercase;
}
.admin-idea-table-row {
    align-items: stretch;
}
.admin-ideas-member-group {
    background: #fff;
    border: 1px solid #d7e2f1;
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    overflow: hidden;
}
.admin-ideas-member-toggle {
    align-items: center;
    background: linear-gradient(135deg, #fff 0%, #f8fbff 100%);
    border: 0;
    color: #060a3d;
    display: flex;
    gap: 12px;
    padding: 15px 16px;
    text-align: left;
    transition: background .2s ease;
    width: 100%;
}
.admin-ideas-member-toggle:hover {
    background: #f8fafc;
}
.admin-ideas-member-toggle[aria-expanded="true"] {
    background: #f8fbff;
    border-bottom: 1px solid #dfe6f2;
}
.admin-ideas-member-identity {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}
.admin-ideas-member-identity > span {
    min-width: 0;
}
.admin-ideas-member-identity strong {
    color: #060a3d;
    display: block;
    font-size: 15px;
    font-weight: 720;
    line-height: 1.25;
}
.admin-ideas-member-identity small {
    color: #64748b;
    display: block;
    font-size: 12px;
    margin-top: 2px;
}
.admin-ideas-member-photo {
    height: 42px;
    width: 42px;
}
.admin-ideas-member-summary {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
    margin-left: auto;
}
.admin-ideas-member-chevron {
    color: #64748b;
    transition: transform .2s ease;
}
.admin-ideas-member-toggle[aria-expanded="true"] .admin-ideas-member-chevron {
    transform: rotate(180deg);
}
.admin-ideas-member-body {
    background: #f6f9ff;
    display: grid;
    gap: 12px;
    max-height: calc((96px * 8) + 84px);
    overflow-y: auto;
    padding: 14px;
    scrollbar-gutter: stable;
}
.admin-ideas-member-body::-webkit-scrollbar {
    width: 8px;
}
.admin-ideas-member-body::-webkit-scrollbar-track {
    background: #edf2fb;
    border-radius: 999px;
}
.admin-ideas-member-body::-webkit-scrollbar-thumb {
    background: #c4d1e5;
    border-radius: 999px;
}
.admin-ideas-member-body .admin-idea-card-approved {
    box-shadow: none;
}
.admin-idea-card-main {
    align-items: flex-start;
    display: grid;
    gap: 14px;
    grid-template-columns: 48px minmax(0, 1fr);
    min-width: 0;
}
.admin-idea-title-cell {
    align-items: flex-start;
    display: grid;
    gap: 12px;
    grid-template-columns: 44px minmax(0, 1fr);
    min-width: 0;
}
.admin-idea-title-cell h3 {
    color: #060a3d;
    font-size: 16px;
    font-weight: 760;
    line-height: 1.3;
    margin: 0 0 7px;
}
.admin-idea-title-cell p {
    color: #475569;
    font-size: 13px;
    line-height: 1.45;
    margin: 8px 0 0;
}
.admin-idea-presenter-cell {
    align-items: center;
    background: #fbfcff;
    border: 1px solid #e1e8f3;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    min-width: 0;
    padding: 12px;
}
.admin-idea-presenter-cell .ideas-presenter-strip {
    align-items: center;
    display: grid;
    gap: 8px;
    justify-items: center;
    margin: 0;
    text-align: center;
}
.admin-idea-presenter-cell .ideas-presenter-photo {
    border-radius: 16px;
    flex-basis: 58px;
    height: 58px;
    width: 58px;
}
.admin-idea-presenter-cell .ideas-presenter-photo-fallback {
    font-size: 16px;
}
.admin-idea-presenter-cell .ideas-presenter-strip strong {
    font-size: 14px;
    font-weight: 800;
}
.admin-idea-presenter-cell .ideas-presenter-strip small {
    font-size: 12px;
    margin-top: 2px;
}
.admin-idea-facts-cell {
    display: grid;
    gap: 7px;
}
.admin-idea-facts-cell span {
    align-items: center;
    background: #fbfcff;
    border: 1px solid #e1e8f3;
    border-radius: 10px;
    color: #475569;
    display: flex;
    font-size: 12px;
    justify-content: space-between;
    line-height: 1.2;
    min-width: 0;
    padding: 8px 10px;
}
.admin-idea-facts-cell strong {
    color: #060a3d;
    flex: 0 0 auto;
    font-weight: 760;
    margin-right: 10px;
}
.admin-idea-content {
    min-width: 0;
}
.admin-idea-title-line {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    justify-content: space-between;
}
.admin-idea-title-line h3 {
    color: #060a3d;
    font-size: 17px;
    font-weight: 760;
    line-height: 1.3;
    margin: 0;
    min-width: min(320px, 100%);
}
.admin-idea-card-main p,
.admin-idea-note p {
    color: #475569;
    font-size: 14px;
    line-height: 1.5;
    margin: 8px 0 0;
}
.admin-ideas-attributes {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 12px;
}
.admin-ideas-attributes span {
    background: #fbfcff;
    border-color: #e1e8f3;
    border-radius: 10px;
    min-width: 0;
    justify-content: space-between;
    padding: 9px 10px;
}
.admin-ideas-attributes strong {
    color: #060a3d;
    margin-right: 10px;
}
.admin-idea-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}
.admin-idea-actions .btn {
    min-height: 40px;
}
.admin-idea-primary-action {
    min-width: 132px;
}
.admin-idea-side {
    align-content: center;
    display: grid;
    gap: 12px;
}
.admin-idea-note {
    align-content: center;
    background: #f8fbff;
    border: 1px solid #e1e8f3;
    border-radius: 12px;
    display: grid;
    min-height: 100%;
    padding: 12px;
}
.admin-idea-note small {
    color: #64748b;
    display: block;
    font-size: 11px;
    font-weight: 700;
    margin-bottom: 4px;
}
.admin-idea-action-cell {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}
.admin-idea-action-cell form {
    margin: 0;
}
.admin-idea-action-cell .btn {
    min-height: 40px;
}
.admin-idea-side > .btn {
    justify-self: stretch;
}
.team-approved-ideas-table {
    padding: 16px;
}
.team-ideas-table-head,
.team-idea-table-row {
    grid-template-columns: minmax(300px, 1fr) minmax(190px, .55fr) minmax(220px, .7fr) minmax(260px, .75fr) minmax(132px, auto);
}
.team-idea-detail-panel {
    background: #fbfcff;
    border: 1px solid #e1e8f3;
    border-radius: 12px;
    grid-column: 1 / -1;
    margin-top: 2px;
    padding: 16px;
}
.admin-idea-compact-row {
    align-items: center;
    background: #fff;
    border: 1px solid #e1e8f3;
    border-radius: 14px;
    display: grid;
    gap: 14px;
    grid-template-columns: 48px minmax(0, 1fr) auto auto;
    padding: 13px 14px;
}
.admin-idea-compact-row h3 {
    color: #060a3d;
    font-size: 14px;
    font-weight: 720;
    margin: 0 0 4px;
}
.admin-idea-compact-row p {
    color: #526174;
    font-size: 12px;
    line-height: 1.4;
    margin: 0;
}
.admin-idea-compact-badges {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}
.appraisal-board,
.appraisal-form-panel,
.appraisal-detail-main,
.appraisal-score-panel {
    padding: 22px;
}
.appraisal-board-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
    margin-bottom: 16px;
}
.appraisal-summary-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 18px;
}
.appraisal-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 1.45fr) repeat(4, minmax(135px, .7fr)) auto auto;
    gap: 10px;
    margin-bottom: 16px;
}
.appraisal-table-wrap {
    border-top: 1px solid var(--line);
}
.appraisal-table {
    min-width: 1120px;
}
.appraisal-table thead th {
    border-bottom: 1px solid var(--line);
    color: #111827;
    font-size: 13px;
    font-weight: 900;
    padding: 14px 12px;
    white-space: nowrap;
}
.appraisal-table tbody td {
    border-bottom: 1px solid var(--line);
    padding: 15px 12px;
    vertical-align: middle;
}
.appraisal-table tbody tr:hover {
    background: #fbfcff;
}
.appraisal-date-cell strong,
.appraisal-date-cell span {
    display: block;
    white-space: nowrap;
}
.appraisal-date-cell strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 850;
}
.appraisal-date-cell span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    margin-top: 3px;
}
.appraisal-score-cell {
    display: grid;
    gap: 7px;
    min-width: 112px;
}
.appraisal-score-pill {
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 900;
    padding: 6px 10px;
    width: fit-content;
    white-space: nowrap;
}
.appraisal-score-pill.strong {
    background: #ecfdf3;
    color: #027a48;
}
.appraisal-score-pill.steady {
    background: #e7f5ff;
    color: #0b7285;
}
.appraisal-score-pill.risk {
    background: #fff1f2;
    color: #be123c;
}
.appraisal-score-meter {
    background: #e9eef7;
    border-radius: 999px;
    display: block;
    height: 7px;
    overflow: hidden;
    width: 110px;
}
.appraisal-score-meter i {
    background: var(--primary);
    border-radius: inherit;
    display: block;
    height: 100%;
}
.team-appraisal-board {
    padding: 22px;
}
.team-appraisal-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
    margin-bottom: 16px;
}
.team-appraisal-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 18px;
}
.team-appraisal-toolbar {
    grid-template-columns: minmax(280px, 1.5fr) repeat(3, minmax(145px, .75fr)) auto auto;
}
.team-appraisal-table-wrap {
    border-top: 1px solid var(--line);
}
.team-appraisal-table {
    min-width: 1080px;
}
.team-appraisal-table thead th {
    border-bottom: 1px solid var(--line);
    color: #111827;
    font-size: 13px;
    font-weight: 900;
    padding: 14px 12px;
    white-space: nowrap;
}
.team-appraisal-table tbody td {
    border-bottom: 1px solid var(--line);
    padding: 15px 12px;
    vertical-align: middle;
}
.team-appraisal-table tbody tr:hover {
    background: #fbfcff;
}
.team-appraisal-review-cell {
    min-width: 360px;
}
.team-appraisal-review-cell strong,
.team-appraisal-review-cell small {
    display: block;
}
.appraisal-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 18px;
    align-items: start;
}
.appraisal-detail-hero {
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 18px;
    margin-bottom: 18px;
}
.appraisal-detail-hero h2 {
    color: var(--ink);
    font-size: clamp(28px, 3vw, 38px);
    font-weight: 900;
    line-height: 1.1;
    margin: 4px 0;
}
.appraisal-detail-hero p {
    color: var(--muted);
    margin: 0;
    font-weight: 700;
}
.appraisal-score-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}
.appraisal-score-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 14px;
}
.appraisal-score-card small,
.appraisal-score-card strong {
    display: block;
}
.appraisal-score-card small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 850;
}
.appraisal-score-card strong {
    color: var(--ink);
    font-size: 24px;
    font-weight: 900;
    margin: 3px 0 10px;
}
.appraisal-score-card .appraisal-score-meter {
    width: 100%;
}
.appraisal-feedback-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}
.appraisal-score-panel {
    position: sticky;
    top: 24px;
}
.appraisal-big-score {
    border: 1px solid var(--line);
    border-radius: 18px;
    background: #fbfcff;
    padding: 22px;
    text-align: center;
    margin-bottom: 12px;
}
.appraisal-big-score strong {
    color: var(--ink);
    display: inline-block;
    font-size: 58px;
    font-weight: 950;
    line-height: 1;
}
.appraisal-big-score span {
    color: var(--muted);
    font-size: 20px;
    font-weight: 850;
}
.appraisal-big-score.strong {
    background: #ecfdf3;
}
.appraisal-big-score.steady {
    background: #e7f5ff;
}
.appraisal-big-score.risk {
    background: #fff1f2;
}
.appraisal-score-panel > .appraisal-score-meter {
    width: 100%;
}
.appraisal-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 18px;
    align-items: start;
}
.appraisal-form-main {
    display: grid;
    gap: 16px;
}
.appraisal-form-section,
.appraisal-guidance-card,
.appraisal-reference-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    padding: 18px;
}
.appraisal-form-section h3,
.appraisal-guidance-card h3 {
    color: var(--ink);
    font-size: 18px;
    font-weight: 900;
    margin: 0 0 14px;
}
.appraisal-form-section .form-label {
    color: var(--ink);
    font-size: 13px;
    font-weight: 850;
}
.appraisal-score-input-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}
.appraisal-score-input-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    display: grid;
    gap: 12px;
    padding: 14px;
}
.appraisal-score-input-card small {
    color: var(--muted);
    display: block;
    font-size: 12px;
    font-weight: 850;
    min-height: 34px;
}
.appraisal-score-input-card .form-control {
    font-size: 22px;
    font-weight: 900;
    text-align: center;
}
.appraisal-guidance-card {
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    position: sticky;
    top: 24px;
}
.appraisal-guidance-card p {
    color: var(--muted);
    font-weight: 700;
}
.appraisal-guidance-card ul {
    display: grid;
    gap: 8px;
    list-style: none;
    margin: 14px 0 0;
    padding: 0;
}
.appraisal-guidance-card li {
    border-top: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-top: 9px;
}
.appraisal-guidance-card li strong {
    color: var(--ink);
}
.appraisal-guidance-card li span {
    color: var(--muted);
    font-weight: 750;
}
.appraisal-reference-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.appraisal-reference-card {
    background: #fff;
}
.appraisal-reference-project {
    border-top: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 0;
}
.appraisal-reference-project strong,
.appraisal-reference-project small {
    display: block;
}
.appraisal-reference-project small {
    color: var(--muted);
    font-weight: 700;
}
.people-board {
    padding: 22px;
}
.people-board-intro {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 16px;
}
.people-board-intro p {
    color: var(--muted);
    font-size: 15px;
    margin: 0;
}
.people-board-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
    margin-bottom: 16px;
}
.people-summary-grid,
.people-profile-summary {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-bottom: 18px;
}
.people-profile-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 0;
}
.people-summary-grid-focused {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.people-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 1.45fr) repeat(4, minmax(135px, .7fr)) auto auto;
    gap: 10px;
    margin-bottom: 16px;
}
.people-toolbar-focused {
    grid-template-columns: minmax(300px, 1.5fr) minmax(170px, .6fr) minmax(170px, .6fr) auto auto;
}
.people-table-wrap {
    border-top: 1px solid var(--line);
}
.people-section-stack {
    display: grid;
    gap: 16px;
}
.people-section-panel {
    background: #fff;
    border: 1px solid #dfe6f2;
    border-radius: 16px;
    overflow: hidden;
}
.people-section-head {
    align-items: center;
    cursor: pointer;
    display: grid;
    gap: 14px;
    grid-template-columns: 44px minmax(0, 1fr) 40px;
    list-style: none;
    padding: 16px 18px;
    user-select: none;
}
.people-section-head::-webkit-details-marker {
    display: none;
}
.people-section-head::marker {
    content: "";
}
.people-section-head > span:nth-child(2) {
    min-width: 0;
}
.people-section-head strong,
.people-section-head small {
    display: block;
}
.people-section-head strong {
    color: #060a3d;
    font-size: 18px;
    line-height: 1.2;
}
.people-section-head small {
    color: #64748b;
    font-size: 13px;
    margin-top: 4px;
}
.people-section-icon {
    border-radius: 13px;
    display: grid;
    font-size: 20px;
    height: 44px;
    place-items: center;
    width: 44px;
}
.people-section-icon-active {
    background: #ecfdf3;
    color: #198754;
}
.people-section-icon-records {
    background: #f1f5f9;
    color: #475569;
}
.people-section-panel[open] .ym-project-collapse-toggle i {
    transform: rotate(180deg);
}
.people-section-body {
    border-top: 1px solid #e4e9f3;
}
.people-section-body .people-table-wrap {
    border-top: 0;
}
.people-table {
    min-width: 980px;
}
.people-reorder-column {
    text-align: center;
    width: 54px;
}
.people-table thead th {
    border-bottom: 1px solid var(--line);
    color: #111827;
    font-size: 13px;
    font-weight: 900;
    padding: 14px 12px;
    white-space: nowrap;
}
.people-table tbody td {
    border-bottom: 1px solid var(--line);
    padding: 15px 12px;
    vertical-align: middle;
}
.people-table tbody tr:hover {
    background: #fbfcff;
}
.people-table tbody tr.is-dragging {
    background: #eef5ff;
    box-shadow: 0 16px 36px rgba(37, 99, 235, .16);
    opacity: .72;
}
.people-member-cell {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 250px;
}
.people-member-cell strong,
.people-member-cell small {
    display: block;
}
.people-member-cell strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 900;
}
.people-member-cell small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}
.people-member-cell small i {
    color: var(--primary);
    margin-right: 5px;
}
.people-role-cell {
    color: var(--ink);
    display: inline-block;
    font-weight: 800;
    min-width: 180px;
}
.people-project-cell strong,
.people-project-cell small {
    display: block;
}
.people-project-cell strong {
    color: var(--ink);
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
}
.people-project-cell small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 750;
    margin-top: 3px;
}
.people-access-cell {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.team-icon-action.success {
    border: 1px solid #b7ebc6;
    background: #fff;
    color: #198754;
}
.roles-board {
    padding: 22px;
}
.roles-admin-hero {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: 0 16px 45px rgba(15, 23, 42, .045);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 18px;
    padding: 24px;
}
.roles-admin-hero h2 {
    color: #060a3d;
    font-size: 26px;
    font-weight: 650;
    margin: 0;
}
.roles-admin-hero p {
    color: var(--muted);
    font-size: 15px;
    margin: 0;
}
.admin-roles-board {
    box-shadow: 0 16px 45px rgba(15, 23, 42, .045);
}
.admin-roles-summary-row {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 16px;
}
.admin-roles-action-row {
    align-items: center;
    border-bottom: 1px solid var(--line);
    display: flex;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 16px;
    padding-bottom: 16px;
}
.admin-roles-action-note {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.4;
}
.roles-board-header {
    border-bottom: 1px solid var(--line);
    padding-bottom: 16px;
    margin-bottom: 16px;
}
.admin-roles-head {
    border-bottom: 1px solid var(--line);
    margin-bottom: 16px;
    padding-bottom: 16px;
}
.roles-summary-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 18px;
}
.roles-summary-grid-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 720px;
    margin-bottom: 0;
    width: min(720px, 100%);
}
.admin-roles-add-btn {
    flex: 0 0 auto;
    white-space: nowrap;
}
.team-project-summary-icon-purple {
    background: #ede9fe;
    color: #7c3aed;
}
.team-project-summary-icon-cyan {
    background: #cffafe;
    color: #0891b2;
}
.team-project-summary-icon-amber {
    background: #fef3c7;
    color: #b45309;
}
.roles-toolbar {
    display: grid;
    grid-template-columns: minmax(300px, 1.4fr) minmax(150px, .55fr) minmax(150px, .55fr) auto auto;
    gap: 10px;
    margin-bottom: 16px;
}
.admin-role-list {
    border: 1px solid var(--line);
    border-radius: 16px;
    overflow: hidden;
}
.admin-sequence-hint {
    align-items: center;
    background: #f8fbff;
    border: 1px dashed #cfe0ff;
    border-radius: 12px;
    color: #475569;
    display: inline-flex;
    font-size: 13px;
    font-weight: 650;
    gap: 8px;
    margin-bottom: 12px;
    padding: 9px 12px;
}
.admin-sequence-hint i {
    color: #2e6bfb;
    font-size: 18px;
}
.admin-drag-handle {
    align-items: center;
    background: #fff;
    border: 1px solid #dbe7ff;
    border-radius: 10px;
    color: #64748b;
    cursor: grab;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 20px;
    height: 38px;
    justify-content: center;
    padding: 0;
    touch-action: none;
    width: 38px;
}
.admin-drag-handle:active {
    cursor: grabbing;
}
.admin-drag-handle:hover,
.admin-drag-handle:focus {
    border-color: #aecaef;
    color: #085bcb;
}
.admin-role-list.is-saving,
.people-table tbody.is-saving {
    opacity: .72;
    pointer-events: none;
}
.admin-role-list.is-saved,
.people-table tbody.is-saved {
    box-shadow: inset 0 0 0 2px rgba(25, 135, 84, .18);
}
.admin-role-row {
    align-items: center;
    background: #fff;
    border-bottom: 1px solid var(--line);
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(320px, 1fr) minmax(280px, .7fr) auto;
    padding: 18px;
}
.admin-role-row:last-child {
    border-bottom: 0;
}
.admin-role-row:hover {
    background: #fbfcff;
}
.admin-role-row.is-dragging {
    background: #eef5ff;
    box-shadow: 0 16px 36px rgba(37, 99, 235, .16);
    opacity: .72;
}
.admin-role-main {
    align-items: flex-start;
    display: flex;
    gap: 14px;
    min-width: 0;
}
.admin-role-order-controls {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 14px;
    display: inline-flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 3px;
    padding: 5px;
}
.admin-role-order-controls form {
    display: inline-flex;
}
.admin-role-order-controls .team-icon-action {
    border-radius: 10px;
    font-size: 14px;
    height: 28px;
    width: 30px;
}
.admin-role-order-controls .team-icon-action:not(:disabled) {
    background: #fff;
    border-color: #bfdbfe;
    color: var(--primary);
}
.admin-role-order-number {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
}
.admin-role-icon {
    align-items: center;
    background: #edf3ff;
    border-radius: 14px;
    color: #2e6bfb;
    display: inline-flex;
    flex: 0 0 52px;
    font-size: 22px;
    height: 52px;
    justify-content: center;
    width: 52px;
}
.admin-role-main h3 {
    color: #060a3d;
    font-size: 17px;
    font-weight: 650;
    margin: 0;
}
.admin-role-main p {
    color: var(--muted);
    font-size: 14px;
    line-height: 1.45;
    margin: 5px 0 10px;
}
.admin-role-tags {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.admin-role-tags > span {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: #475569;
    display: inline-flex;
    font-size: 12px;
    font-weight: 600;
    gap: 6px;
    padding: 5px 10px;
}
.admin-role-tags i {
    color: #2e6bfb;
}
.admin-role-metrics {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.admin-role-metrics > div {
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 12px;
}
.admin-role-metrics strong,
.admin-role-metrics small {
    display: block;
}
.admin-role-metrics strong {
    color: #060a3d;
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}
.admin-role-metrics small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    margin-top: 5px;
}
.admin-role-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}
.roles-table-wrap {
    border-top: 1px solid var(--line);
}
.roles-table {
    min-width: 1120px;
}
.roles-table thead th {
    border-bottom: 1px solid var(--line);
    color: #111827;
    font-size: 13px;
    font-weight: 900;
    padding: 14px 12px;
    white-space: nowrap;
}
.roles-table tbody td {
    border-bottom: 1px solid var(--line);
    padding: 15px 12px;
    vertical-align: middle;
}
.roles-table tbody tr:hover {
    background: #fbfcff;
}
.roles-title-cell {
    min-width: 390px;
}
.roles-title-wrap {
    display: flex;
    align-items: center;
    gap: 12px;
}
.roles-role-icon {
    align-items: center;
    background: #eef4ff;
    border-radius: 12px;
    color: var(--primary);
    display: inline-flex;
    flex: 0 0 44px;
    font-weight: 950;
    height: 44px;
    justify-content: center;
    width: 44px;
}
.roles-title-wrap strong,
.roles-title-wrap small {
    display: block;
}
.roles-title-wrap strong {
    color: var(--ink);
    font-size: 15px;
    font-weight: 900;
}
.roles-title-wrap small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    margin-top: 2px;
}
.roles-department-pill {
    align-items: center;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: #334155;
    display: inline-flex;
    font-size: 13px;
    font-weight: 850;
    gap: 7px;
    padding: 8px 11px;
    white-space: nowrap;
}
.roles-department-pill i {
    color: var(--primary);
}
.roles-count-cell strong,
.roles-count-cell small {
    display: block;
}
.roles-count-cell strong {
    color: var(--ink);
    font-size: 24px;
    font-weight: 950;
    line-height: 1;
}
.roles-count-cell small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    margin-top: 4px;
}
.roles-coverage {
    display: grid;
    gap: 6px;
    min-width: 150px;
}
.roles-coverage-track {
    background: #e9eef7;
    border-radius: 999px;
    display: block;
    height: 8px;
    overflow: hidden;
    width: 100%;
}
.roles-coverage-track span {
    background: var(--primary);
    border-radius: inherit;
    display: block;
    height: 100%;
}
.roles-coverage small {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
}
.people-profile-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 24px;
}
.people-profile-main {
    display: flex;
    align-items: center;
    gap: 16px;
}
.people-profile-main h2 {
    color: var(--ink);
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 900;
    line-height: 1.1;
    margin: 4px 0;
}
.people-profile-main p {
    color: var(--muted);
    font-weight: 700;
    margin: 0;
}
.people-profile-badges,
.people-profile-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}
.people-profile-actions {
    justify-content: flex-end;
    margin-top: 0;
}
.people-profile-actions form {
    display: inline-flex;
}
.profile-hero-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 118px;
    padding: 18px 20px;
}
.profile-hero-main {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
}
.profile-hero-avatar {
    width: 76px;
    min-width: 76px;
    height: 76px;
}
.profile-hero-copy {
    min-width: 0;
}
.profile-hero-copy h2 {
    color: var(--ink);
    font-size: clamp(24px, 2.2vw, 32px);
    font-weight: 650;
    line-height: 1.1;
    margin: 0 0 8px;
}
.profile-meta-line {
    color: var(--muted);
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    font-size: 14px;
    line-height: 1.3;
}
.profile-contact-line {
    margin-top: 4px;
}
.profile-completion-badge {
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    background: #eff6ff;
    color: var(--primary);
    display: inline-flex;
    margin-top: 10px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 700;
}
.profile-hero-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.profile-alert {
    margin-top: 16px;
}
.profile-edit-form {
    display: grid;
    gap: 16px;
    margin-top: 16px;
}
.profile-edit-form .profile-section-card {
    margin-top: 0;
}
.profile-edit-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 20px;
}
.profile-edit-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profile-edit-address,
.profile-edit-wide {
    grid-column: span 2;
}
.profile-edit-doc-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.profile-upload-tile {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    min-width: 0;
    padding: 14px;
}
.profile-upload-tile .form-text {
    font-size: 12px;
    line-height: 1.35;
}
.profile-edit-two-column {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(500px, 1.1fr);
    gap: 16px;
    align-items: stretch;
}
.profile-edit-two-column .profile-detail-stack {
    height: 100%;
}
.profile-edit-two-column .profile-skill-panel {
    height: 100%;
}
.profile-edit-submit-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.profile-edit-submit-body .form-actions {
    margin-top: 0;
}
.profile-edit-form .form-label {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 6px;
}
.profile-edit-form .form-control,
.profile-edit-form .form-select {
    border-radius: 12px;
    min-height: 42px;
}
.profile-identity-hero .people-profile-main h2 {
    font-size: clamp(24px, 2.3vw, 34px);
}
.profile-inline-progress {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fbfcff;
    color: var(--muted);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    padding: 6px 10px;
    font-size: 13px;
    font-weight: 700;
}
.profile-inline-progress strong {
    color: var(--primary);
}
.profile-completion-card {
    margin-top: 16px;
    padding: 18px 20px;
}
.profile-completion-card,
.profile-section-card {
    position: relative;
    overflow: hidden;
}
.profile-completion-card::before,
.profile-section-card::before {
    content: "";
    height: 4px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.profile-section-completion {
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}
.profile-section-completion::before,
.profile-section-basic::before {
    background: #2e6bfb;
}
.profile-section-basic {
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
}
.profile-section-education::before {
    background: #f59e0b;
}
.profile-section-education {
    background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%);
}
.profile-section-employment::before,
.profile-section-documents::before {
    background: #16834f;
}
.profile-section-employment,
.profile-section-documents {
    background: linear-gradient(180deg, #ffffff 0%, #f7fcfa 100%);
}
.profile-section-previous::before,
.profile-section-history::before {
    background: #64748b;
}
.profile-section-previous,
.profile-section-history {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}
.profile-section-reference::before,
.profile-section-skills::before {
    background: #7c3aed;
}
.profile-section-reference,
.profile-section-skills {
    background: linear-gradient(180deg, #ffffff 0%, #fbf8ff 100%);
}
.profile-completion-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}
.profile-title-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}
.profile-title-icon {
    width: 24px;
    min-width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
    line-height: 1;
    margin-top: 1px;
}
.profile-title-icon-primary {
    color: #2563eb;
}
.profile-title-icon-success {
    color: #16834f;
}
.profile-title-icon-warning {
    color: #f59e0b;
}
.profile-title-icon-slate {
    color: #64748b;
}
.profile-completion-header h2,
.profile-section-header h2 {
    color: var(--ink);
    font-size: 20px;
    font-weight: 650;
    margin: 0 0 4px;
}
.profile-completion-header p,
.profile-section-header p {
    color: var(--muted);
    margin: 0;
}
.profile-completion-row {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 16px;
    align-items: center;
}
.profile-completion-score {
    border-right: 1px solid var(--line);
    padding-right: 16px;
}
.profile-completion-score strong,
.profile-completion-score span {
    display: block;
}
.profile-completion-score strong {
    color: var(--ink);
    font-size: 34px;
    line-height: 1;
}
.profile-completion-score span {
    color: var(--muted);
    margin-top: 8px;
}
.profile-missing-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}
.profile-missing-list span {
    border: 1px solid #fed7aa;
    border-radius: 999px;
    background: #fff7ed;
    color: #9a3412;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 9px;
}
.profile-section-card {
    margin-top: 16px;
    padding: 18px 20px;
}
.profile-section-header {
    margin-bottom: 14px;
}
.profile-section-body {
    margin-left: 34px;
}
.profile-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 16px;
    align-items: stretch;
}
.profile-card-grid .profile-section-card {
    margin-top: 0;
}
.profile-detail-layout {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(500px, 1.1fr);
    gap: 16px;
    margin-top: 16px;
    align-items: stretch;
}
.profile-detail-stack {
    display: grid;
    gap: 12px;
    grid-template-rows: none;
    height: 100%;
}
.profile-detail-stack .profile-section-card,
.profile-skill-panel {
    margin-top: 0;
}
.profile-detail-stack .profile-section-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
    padding-top: 14px;
    padding-bottom: 14px;
}
.profile-detail-stack .profile-section-header {
    margin-bottom: 10px;
}
.profile-detail-stack .profile-mini-empty {
    padding: 10px 12px;
}
.profile-skill-panel {
    align-self: stretch;
    display: flex;
    flex-direction: column;
}
.profile-skill-panel .profile-section-body {
    display: flex;
    flex: 1;
    flex-direction: column;
}
.profile-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}
.profile-basic-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px 20px;
    align-items: start;
}
.profile-basic-address {
    grid-column: span 2;
}
.profile-field-grid-compact {
    gap: 10px 14px;
}
.profile-field {
    min-width: 0;
}
.profile-field span,
.profile-field strong {
    display: block;
}
.profile-field span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 3px;
}
.profile-field strong {
    color: var(--ink);
    font-size: 15.5px;
    font-weight: 650;
    line-height: 1.35;
    overflow-wrap: anywhere;
}
.profile-field-wide {
    grid-column: 1 / -1;
}
.profile-mini-empty {
    border: 1px dashed var(--line);
    border-radius: 12px;
    background: #fbfcff;
    color: var(--muted);
    font-size: 14px;
    padding: 12px 14px;
}
.profile-accordion-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-top: 16px;
    align-items: start;
}
.profile-accordion-card {
    padding: 0;
    overflow: hidden;
}
.profile-wide-accordion {
    margin-top: 16px;
}
.profile-accordion-card summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    list-style: none;
    padding: 16px 18px;
}
.profile-accordion-card summary::-webkit-details-marker {
    display: none;
}
.profile-accordion-card summary strong,
.profile-accordion-card summary small {
    display: block;
}
.profile-accordion-card summary strong {
    color: var(--ink);
    font-size: 18px;
    font-weight: 650;
}
.profile-accordion-card summary small {
    color: var(--muted);
    margin-top: 3px;
}
.profile-accordion-card[open] summary {
    border-bottom: 1px solid var(--line);
}
.profile-accordion-card summary i {
    color: var(--muted);
    transition: transform .18s ease;
}
.profile-accordion-card[open] summary i {
    transform: rotate(180deg);
}
.profile-accordion-body {
    padding: 16px 18px 18px;
}
.profile-document-list {
    display: grid;
    gap: 8px;
}
.profile-document-row {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    color: inherit;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 10px 12px;
}
.profile-document-row:hover {
    color: inherit;
    background: #fff;
}
.profile-document-row i {
    font-size: 17px;
}
.profile-document-row.uploaded i,
.profile-document-row.uploaded strong {
    color: #16834f;
}
.profile-document-row.missing i,
.profile-document-row.missing strong {
    color: #dc3545;
}
.profile-document-row span {
    color: var(--ink);
    font-weight: 600;
    overflow-wrap: anywhere;
}
.profile-document-row strong {
    font-size: 13px;
}
.profile-document-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.profile-document-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    color: inherit;
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-height: 94px;
    padding: 14px;
    transition: background .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.profile-document-card:hover {
    border-color: #bfdbfe;
    background: #fff;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
    color: inherit;
    transform: translateY(-1px);
}
.profile-document-card i {
    font-size: 20px;
    line-height: 1;
}
.profile-document-card span {
    color: var(--ink);
    font-size: 14px;
    font-weight: 650;
    line-height: 1.25;
}
.profile-document-card strong {
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}
.profile-document-card.uploaded i,
.profile-document-card.uploaded strong {
    color: #16834f;
}
.profile-document-card.missing i,
.profile-document-card.missing strong {
    color: #dc3545;
}
.profile-skill-list {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
}
.profile-skill-scale,
.profile-skill-editor-scale {
    color: var(--muted);
    display: grid;
    font-size: 11px;
    font-weight: 700;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
}
.profile-skill-bar-row {
    border-bottom: 1px solid var(--line);
    background: #fff;
    display: grid;
    grid-template-columns: minmax(150px, 200px) minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    flex: 1 1 0;
    min-height: 58px;
    padding: 6px 8px 7px;
}
.profile-skill-bar-row:first-child {
    border-top: 1px solid var(--line);
}
.profile-skill-bar-row:hover {
    background: #fbfcff;
}
.profile-skill-name span,
.profile-skill-name strong {
    display: block;
}
.profile-skill-name span {
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
}
.profile-skill-meter {
    height: 42px;
    min-width: 0;
    position: relative;
}
.profile-skill-track {
    background: #e5e7eb;
    border-radius: 999px;
    display: block;
    height: 8px;
    position: absolute;
    top: 15px;
    left: 4%;
    right: 4%;
}
.profile-skill-dots {
    align-items: center;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    height: 31px;
    position: relative;
    z-index: 1;
}
.profile-skill-dots span {
    align-items: center;
    background: #e5e7eb;
    border: 3px solid #fff;
    border-radius: 999px;
    box-shadow: 0 1px 5px rgba(15, 23, 42, .08);
    display: inline-flex;
    height: 31px;
    justify-content: center;
    justify-self: center;
    position: relative;
    width: 31px;
}
.profile-skill-dots span.is-current {
    background: #fff;
    border: 5px solid #2e6bfb;
    box-shadow: 0 8px 20px rgba(46, 107, 251, .18);
}
.profile-skill-labels {
    color: var(--muted);
    display: grid;
    font-size: 11px;
    font-weight: 400;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    line-height: 1.2;
    text-align: center;
    margin-top: 0;
    min-height: 13px;
}
.profile-skill-labels small {
    font-size: inherit;
    font-weight: inherit;
}
.profile-skill-labels small.is-current {
    color: var(--muted);
    font-weight: 400;
}
.profile-skill-row-view {
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 36px;
    padding: 8px 0;
}
.profile-skill-row-view:last-child {
    border-bottom: 0;
}
.profile-skill-row-view span,
.profile-skill-row-view strong {
    line-height: 1.25;
}
.profile-skill-row-view span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
}
.profile-skill-row-view strong {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--ink);
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 700;
    padding: 5px 9px;
}
.profile-skill-editor {
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    display: grid;
    gap: 0;
    overflow: hidden;
}
.profile-skill-editor-scale {
    background: #f8fafc;
    border-bottom: 1px solid var(--line);
    margin-left: 220px;
    padding: 12px 16px 10px;
}
.profile-skill-editor-row {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    border-bottom: 1px solid var(--line);
    padding: 14px 16px;
}
.profile-skill-editor-row:last-child {
    border-bottom: 0;
}
.profile-skill-editor-row > strong {
    color: var(--ink);
    font-size: 14px;
    font-weight: 650;
    line-height: 1.25;
}
.profile-skill-choice-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    position: relative;
}
.profile-skill-choice-grid::before {
    background: #e5e7eb;
    border-radius: 999px;
    content: "";
    height: 9px;
    left: 8%;
    right: 8%;
    position: absolute;
    top: 13px;
}
.profile-skill-choice {
    cursor: pointer;
    display: grid;
    gap: 7px;
    justify-items: center;
    margin: 0;
    position: relative;
    z-index: 1;
}
.profile-skill-choice input {
    opacity: 0;
    pointer-events: none;
    position: absolute;
}
.profile-skill-choice span {
    background: #e5e7eb;
    border: 3px solid #fff;
    border-radius: 999px;
    box-shadow: 0 1px 4px rgba(15, 23, 42, .08);
    height: 32px;
    transition: background .18s ease, box-shadow .18s ease, border-color .18s ease, transform .18s ease;
    width: 32px;
}
.profile-skill-choice small {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.15;
    text-align: center;
}
.profile-skill-choice:hover span {
    background: #fff;
    border-color: #2e6bfb;
    transform: translateY(-1px);
}
.profile-skill-choice input:checked + span {
    background: #fff;
    border: 5px solid #2e6bfb;
    box-shadow: 0 8px 20px rgba(46, 107, 251, .18);
    transform: scale(1.14);
}
.profile-skill-choice input:checked ~ small {
    color: var(--muted);
    font-weight: 400;
}
.profile-skill-chip-grid,
.profile-history-fields {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.profile-skill-chip,
.profile-history-fields span {
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fbfcff;
    color: var(--muted);
    font-size: 13px;
    padding: 6px 10px;
}
.profile-skill-chip strong {
    color: var(--ink);
    font-weight: 650;
}
.profile-skill-more summary {
    color: var(--primary);
    cursor: pointer;
    display: inline-flex;
    font-weight: 700;
    margin-top: 10px;
}
.profile-collapse-card,
.profile-history-card {
    padding: 0;
}
.profile-collapse-card summary,
.profile-history-card summary {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    list-style: none;
    padding: 22px;
}
.profile-collapse-card summary::-webkit-details-marker,
.profile-history-card summary::-webkit-details-marker {
    display: none;
}
.profile-collapse-card summary strong,
.profile-collapse-card summary small,
.profile-history-card summary strong,
.profile-history-card summary small {
    display: block;
}
.profile-collapse-card summary strong,
.profile-history-card summary strong {
    color: var(--ink);
    font-size: 18px;
}
.profile-collapse-card summary small,
.profile-history-card summary small {
    color: var(--muted);
    margin-top: 3px;
}
.profile-collapse-card[open] summary,
.profile-history-card[open] summary {
    border-bottom: 1px solid var(--line);
}
.profile-collapse-card .detail-list {
    padding: 0 22px 22px;
}
.profile-history-actions {
    display: flex;
    justify-content: flex-end;
    padding: 16px 22px 0;
}
.profile-skill-view-card {
    padding: 22px;
}
.profile-skill-view-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.profile-skill-view-item {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 10px 12px;
}
.profile-skill-view-item span,
.profile-skill-view-item strong {
    display: block;
}
.profile-skill-view-item span {
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
}
.profile-skill-view-item strong {
    color: var(--ink);
    margin-top: 3px;
}
.people-profile-layout {
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    gap: 18px;
    align-items: start;
}
.people-profile-card {
    padding: 22px;
}
.people-doc-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.people-doc-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fbfcff;
    color: inherit;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 86px;
    padding: 14px;
}
.people-doc-card:hover {
    color: inherit;
    border-color: #cbd5e1;
    background: #fff;
}
.people-doc-card i {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    font-size: 18px;
}
.people-doc-card.complete i {
    background: #ecfdf3;
    color: #198754;
}
.people-doc-card.missing i {
    background: #fff1f2;
    color: #dc3545;
}
.people-doc-card strong,
.people-doc-card small {
    display: block;
}
.people-doc-card strong {
    color: var(--ink);
    font-weight: 900;
}
.people-doc-card small {
    color: var(--muted);
    font-weight: 700;
}

/* Softer product typography: closer to the clean reference, without heavy bold blocks. */
.sidebar-brand {
    gap: 12px;
    padding: 8px 8px 14px;
    min-height: 86px;
}
.sidebar-logo-mark {
    width: 64px;
    height: 64px;
    border: 1px solid #e5edf8;
    box-shadow: 0 12px 26px rgba(24, 24, 118, .08);
}
.sidebar-brand-copy strong {
    color: #181876;
    font-size: 18.5px;
    font-weight: 600;
    line-height: 1.12;
}
.sidebar-brand-copy small {
    color: #52628a;
    font-size: 13.5px;
    font-weight: 400;
    line-height: 1.15;
    margin-top: 3px;
}
.sidebar .nav-link.sidebar-nav-link {
    color: #18223a;
    font-size: 15px;
    font-weight: 500;
}
.sidebar .nav-link.sidebar-nav-link.active {
    color: var(--sidebar-primary);
    font-weight: 500;
}
.sidebar .nav-link.sidebar-nav-sub-link {
    font-size: 13px;
    font-weight: 500;
}
.sidebar .nav-link.sidebar-nav-link b {
    font-weight: 600;
}
.sidebar-profile strong {
    font-weight: 600;
}
.sidebar-profile-initials,
.avatar {
    font-weight: 600;
}
.sidebar-profile a {
    font-weight: 500;
}
.eyebrow,
.dashboard-filter-disclosure > summary,
.dashboard-filter-panel .form-label,
.stat-card small,
.summary-rate-footer small,
.smart-kpi-card small,
.smart-panel-header p,
.project-status-tabs span,
.project-row-note small,
.team-project-summary-copy small,
.team-project-date-cell span,
.orientation-summary-card small,
.suggestion-summary-card small,
.score-grid small,
.detail-list dt,
.people-doc-card small {
    font-weight: 500;
}
.topbar h1,
.topbar h2,
.topbar .h1,
.topbar .h2,
.topbar .h3,
.summary-group-header h2,
.smart-dashboard-hero h2,
.smart-panel-header h2,
.panel-header h2,
.empty-state h3,
.task-card h3,
.project-row-title h3,
.team-project-title-cell strong,
.team-project-table thead th,
.orientation-dashboard-main h2,
.orientation-template-hero h2,
.suggestion-detail-hero h2,
.appraisal-detail-hero h2,
.people-profile-main h2 {
    color: #060a3d;
    font-weight: 600;
}
.stat-card strong,
.summary-rate-footer strong,
.smart-kpi-card strong,
.smart-health-row strong,
.team-project-summary-copy strong,
.team-project-date-cell strong,
.orientation-summary-card strong,
.suggestion-summary-card strong,
.score-pill,
.team-update-pill,
.big-score {
    font-weight: 650;
}

/* App-wide typography softening for all modules. */
.content :is(h1, h2, h3, h4, h5, h6),
.login-panel h1,
.login-visual h2,
.signup-intro h1,
.signup-visual h2,
.signup-card-header h2,
.team-hero h2,
.profile-card h2,
.orientation-dashboard-main h2,
.orientation-template-hero h2,
.suggestion-detail-hero h2,
.appraisal-detail-hero h2,
.people-profile-main h2 {
    color: #060a3d;
    font-weight: 600;
    letter-spacing: 0;
}
.content :is(p, small, td, li, dd),
.content .text-muted,
.content .panel-header p,
.content .summary-group-header p,
.content .smart-panel-header p,
.content .project-row-title p,
.content .team-project-title-cell span,
.content .team-project-title-cell small,
.content .team-project-date-cell span,
.login-brand small,
.brand small,
.signup-intro p,
.signup-card-header p {
    font-weight: 400;
}
.content :is(strong, b),
.content :is(th, .form-label, .btn, .badge),
.content .score-pill,
.content .team-update-pill,
.content .project-status-tabs span,
.content .project-row-note small,
.content .detail-list dt,
.content .score-grid small,
.signup-steps span,
.signup-progress button,
.signup-card .form-label {
    font-weight: 600;
}
.content :is(.stat-card, .smart-kpi-card, .summary-rate-footer, .team-project-summary-item, .orientation-summary-card, .suggestion-summary-card) small {
    font-weight: 500;
}
.content :is(.stat-card, .smart-kpi-card, .summary-rate-footer, .team-project-summary-item, .orientation-summary-card, .suggestion-summary-card) strong,
.content .big-score {
    font-weight: 600;
}
.login-brand strong,
.brand strong,
.upload-card strong {
    font-weight: 600;
}

/* Project-page typography scale applied across every module. */
.content .topbar :is(h1, h2, .h1, .h2, .h3) {
    font-size: 28px;
    line-height: 1.16;
}
.content :is(
    .panel-header h2,
    .summary-group-header h2,
    .smart-panel-header h2,
    .projects-panel-header h2,
    .team-project-header h2,
    .people-board-header h2,
    .roles-board-header h2,
    .suggestion-board-header h2,
    .suggestion-section-header h2,
    .appraisal-board-header h2,
    .team-appraisal-header h2,
    .orientation-progress-head h3,
    .orientation-template-section-head h3
) {
    font-size: 20px;
    line-height: 1.25;
}
.content :is(
    .panel-header p,
    .summary-group-header p,
    .smart-panel-header p,
    .projects-panel-header p,
    .team-project-header p,
    .people-board-header p,
    .roles-board-header p,
    .suggestion-board-header p,
    .suggestion-section-header p,
    .appraisal-board-header p,
    .team-appraisal-header p
) {
    font-size: 15px;
    line-height: 1.45;
}
.content :is(
    .project-row-title h3,
    .team-project-title-cell strong,
    .suggestion-title-cell strong,
    .roles-title-wrap strong,
    .people-member-cell strong,
    .appraisal-reference-project strong,
    .team-project-card strong,
    .team-suggestion-card strong,
    .shared-suggestion-title-row h3,
    .suggestion-copy-card h3,
    .suggestion-assignment-card h3,
    .suggestion-guidance-card h3,
    .appraisal-form-section h3,
    .appraisal-guidance-card h3,
    .orientation-section h4,
    .orientation-employee-card strong,
    .people-doc-card strong
) {
    font-size: 15px;
    line-height: 1.35;
}
.content :is(
    .project-row-title p,
    .team-project-title-cell span,
    .suggestion-title-cell span,
    .roles-title-wrap small,
    .people-member-cell small,
    .appraisal-reference-project small,
    .team-project-card small,
    .team-suggestion-card small,
    .suggestion-date-cell,
    .suggestion-feedback-cell,
    .suggestion-admin-note,
    .orientation-employee-card small,
    .people-doc-card small
) {
    font-size: 13px;
    line-height: 1.45;
}
.content :is(
    .team-project-title-cell small,
    .team-project-date-cell span,
    .project-row-date strong,
    .appraisal-date-cell span,
    .people-project-cell small,
    .roles-count-cell small,
    .roles-coverage small,
    .orientation-list-progress strong,
    .orientation-list-progress small
) {
    font-size: 12px;
    line-height: 1.35;
}
.content :is(
    .team-project-table thead th,
    .suggestion-table thead th,
    .appraisal-table thead th,
    .people-table thead th,
    .roles-table thead th,
    .table thead th
) {
    font-size: 13px;
    line-height: 1.3;
}
.content :is(.table td, .table th) {
    font-size: 14px;
}
.content :is(.form-label, .form-control, .form-select, .input-group-text, .btn) {
    font-size: 14px;
}
.content :is(
    .team-project-summary-copy small,
    .suggestion-summary-card small,
    .orientation-summary-card small,
    .smart-kpi-card small,
    .stat-card small,
    .summary-rate-footer small
) {
    font-size: 13px;
}
.content :is(
    .team-project-summary-copy strong,
    .suggestion-summary-card strong,
    .orientation-summary-card strong,
    .smart-kpi-card strong,
    .stat-card strong
) {
    font-size: 28px;
    line-height: 1;
}
.content :is(
    .team-project-date-cell strong,
    .appraisal-date-cell strong,
    .roles-count-cell strong,
    .people-project-cell strong
) {
    font-size: 14px;
    line-height: 1.25;
}
.content :is(
    .badge,
    .score-pill,
    .team-update-pill,
    .suggestion-assignment-pill,
    .suggestion-category-pill,
    .appraisal-score-pill
) {
    font-size: 12px;
    line-height: 1.1;
}
.content :is(
    .orientation-dashboard-main h2,
    .orientation-template-hero h2,
    .suggestion-detail-hero h2,
    .appraisal-detail-hero h2,
    .people-profile-main h2,
    .team-hero h2
) {
    font-size: 22px;
    line-height: 1.2;
}

/* Branded login experience. */
.login-page {
    background: #f8fafc;
    grid-template-columns: minmax(440px, 540px) minmax(0, 1fr);
}
.login-panel {
    box-shadow: 18px 0 46px rgba(15, 23, 42, .08);
    justify-content: flex-start;
    padding: clamp(36px, 3.6vw, 58px);
}
.login-panel .talent-brand {
    color: inherit;
    margin-bottom: clamp(64px, 10vh, 110px);
}
.login-panel .talent-brand:hover {
    color: inherit;
}
.login-panel .talent-brand .brand-mark {
    width: 66px;
    height: 66px;
    box-shadow: 0 14px 30px rgba(24, 24, 118, .08);
}
.login-panel .talent-brand strong {
    color: #181876;
    display: block;
    font-size: 22px;
    font-weight: 600;
    line-height: 1.08;
    white-space: nowrap;
}
.login-panel .talent-brand strong em {
    color: #085bcb;
    font-style: normal;
}
.login-panel .talent-brand small {
    color: #52628a;
    font-size: 14px;
    line-height: 1.08;
    margin-top: 3px;
}
.login-copy {
    max-width: 430px;
}
.login-panel .login-copy h1 {
    color: #111827;
    font-size: clamp(34px, 2.8vw, 44px);
    font-weight: 600;
    line-height: 1.08;
    margin: 0;
    white-space: nowrap;
}
.login-panel .login-copy h1 span {
    display: inline-block;
    margin-left: 6px;
}
.login-copy p {
    color: #6b7280;
    font-size: 17px;
    line-height: 1.55;
    margin: 20px 0 0;
}
.login-form {
    max-width: 430px;
    margin-top: 38px;
}
.login-form .form-label {
    color: #111827;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 8px;
}
.login-form .input-group {
    border-radius: 14px;
}
.login-form .input-group-text,
.login-form .form-control {
    min-height: 50px;
    border-color: #e5e7eb;
    background: #fff;
    color: #111827;
    font-size: 15px;
}
.login-form .input-group-text {
    color: #6b7280;
    border-right: 0;
    border-radius: 14px 0 0 14px;
    padding-left: 16px;
    padding-right: 12px;
}
.login-form .form-control {
    border-left: 0;
    border-radius: 0 14px 14px 0;
}
.login-form .form-control:focus {
    border-color: #b8ccff;
    box-shadow: 0 0 0 .2rem rgba(8, 91, 203, .10);
}
.login-form .input-group:focus-within .input-group-text {
    border-color: #b8ccff;
    color: #085bcb;
}
.login-form .form-check-label {
    color: #374151;
    font-size: 14px;
}
.login-form .form-check-input:checked {
    background-color: #085bcb;
    border-color: #085bcb;
}
.login-form .btn-primary {
    background: #085bcb;
    border-color: #085bcb;
    border-radius: 14px;
    box-shadow: 0 16px 34px rgba(8, 91, 203, .18);
    font-size: 15px;
    font-weight: 600;
    min-height: 52px;
}
.login-form .btn-primary:hover {
    background: #064da9;
    border-color: #064da9;
}
.login-signup-link {
    color: #6b7280;
    font-size: 14px;
    margin: 22px 0 0;
    text-align: center;
}
.login-signup-link a {
    color: #085bcb;
    font-weight: 600;
}
.login-visual {
    align-items: flex-end;
    background: #181876;
    min-height: 100vh;
    overflow: hidden;
    padding: clamp(40px, 7vw, 96px);
    position: relative;
}
.login-visual::after {
    background: linear-gradient(90deg, rgba(24, 24, 118, .82), rgba(8, 91, 203, .68));
    content: "";
    inset: 0;
    position: absolute;
    z-index: 1;
}
.login-hero-slides,
.login-hero-slide {
    inset: 0;
    position: absolute;
}
.login-hero-slides {
    z-index: 0;
}
.login-hero-slide {
    background-position: center;
    background-size: cover;
    opacity: 0;
    transform: scale(1.03);
    transition: opacity 1s ease, transform 6s ease;
}
.login-hero-slide.is-active {
    opacity: 1;
    transform: scale(1);
}
.login-hero-copy {
    margin-bottom: clamp(26px, 7vh, 78px);
    max-width: min(96%, 1180px);
    position: relative;
    z-index: 2;
}
.login-hero-copy h2 {
    color: #fff;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 600;
    line-height: 1.08;
    margin: 0;
    max-width: none;
    opacity: 1;
    transition: opacity .32s ease, transform .32s ease;
    white-space: nowrap;
}
.login-motivation {
    color: rgba(255, 255, 255, .92);
    font-size: clamp(18px, 1.6vw, 22px);
    line-height: 1.55;
    margin: 22px 0 0;
    max-width: 620px;
    opacity: 1;
    transition: opacity .32s ease, transform .32s ease;
}
.login-hero-copy h2.is-fading,
.login-motivation.is-fading {
    opacity: 0;
    transform: translateY(6px);
}
.signup-simple-page .login-panel .talent-brand {
    margin-bottom: clamp(34px, 5vh, 58px);
}
.signup-simple-page .login-copy p {
    max-width: 390px;
}
.signup-simple-page .login-form {
    margin-top: 30px;
}
.signup-simple-form .mb-3 {
    margin-bottom: 14px !important;
}
.signup-simple-form .mb-4 {
    margin-bottom: 22px !important;
}
.role-check-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.role-check-card {
    align-items: flex-start;
    border: 1px solid #e5e9f2;
    border-radius: 14px;
    display: flex;
    gap: 10px;
    margin: 0;
    padding: 12px 14px;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.role-check-card:hover {
    border-color: #b8ccff;
    box-shadow: 0 12px 26px rgba(8, 91, 203, .08);
    transform: translateY(-1px);
}
.role-check-card .form-check-input {
    margin-left: 0;
    margin-top: 3px;
}
.role-check-card strong {
    color: #172033;
    display: block;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
}
.role-check-card small {
    color: #6b7280;
    display: block;
    font-size: 12px;
    margin-top: 2px;
}
.role-learning-editor {
    background: #f8fafc;
    border: 1px solid #e5e9f2;
    border-radius: 18px;
    padding: 18px;
}
.role-learning-editor-head {
    align-items: flex-start;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 16px;
}
.role-learning-editor-head h2 {
    color: #172033;
    font-size: 19px;
    font-weight: 600;
    margin: 0;
}
.role-learning-editor-head p {
    color: #6b7280;
    margin: 4px 0 0;
}
.role-learning-list {
    display: grid;
    gap: 12px;
}
.role-learning-row {
    align-items: flex-start;
    background: #fff;
    border: 1px solid #e5e9f2;
    border-radius: 16px;
    display: flex;
    gap: 14px;
    padding: 14px;
}
.role-learning-row-icon {
    align-items: center;
    background: #fff1f2;
    border-radius: 14px;
    color: #dc2626;
    display: inline-flex;
    flex: 0 0 44px;
    font-size: 20px;
    height: 44px;
    justify-content: center;
}
.role-learning-row-icon-kpi,
.role-learning-row-icon-material {
    background: #f1f5ff;
    color: #2e6bfb;
}
.role-learning-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}
.role-learning-card,
.team-learning-card {
    background: #fff;
    border: 1px solid #e5e9f2;
    border-radius: 18px;
    overflow: hidden;
}
.role-video-frame {
    aspect-ratio: 16 / 9;
    background: #0f172a;
    width: 100%;
}
.role-video-frame iframe {
    border: 0;
    display: block;
    height: 100%;
    width: 100%;
}
.role-video-frame.compact {
    border-radius: 14px;
    overflow: hidden;
}
.role-video-fallback {
    align-items: center;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, #111827, #1d4ed8);
    color: #fff;
    display: flex;
    flex-direction: column;
    font-weight: 600;
    gap: 8px;
    justify-content: center;
}
.role-video-fallback i {
    color: #ef4444;
    font-size: 34px;
}
.role-learning-card-body {
    padding: 16px;
}
.role-learning-card-body h3,
.team-learning-card h3 {
    color: #172033;
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}
.role-learning-card-body p,
.team-learning-card p {
    color: #6b7280;
    margin: 6px 0 0;
}
.role-learning-card-body a,
.team-learning-card a {
    color: #085bcb;
    display: inline-flex;
    font-weight: 600;
    margin-top: 12px;
}
.team-learning-block {
    border-top: 1px solid #e5e9f2;
    margin-top: 18px;
    padding-top: 18px;
}
.team-learning-list {
    display: grid;
    gap: 12px;
}
.team-learning-card {
    display: grid;
    gap: 12px;
    padding: 12px;
}
.team-learning-title-row {
    align-items: flex-start;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}
.team-learning-status {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 600;
    gap: 5px;
    padding: 6px 10px;
}
.team-learning-status.is-required {
    background: #fff7ed;
    color: #c2410c;
}
.team-learning-status.is-watched {
    background: #dcfce7;
    color: #15803d;
}
.team-learning-progress {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}
.team-learning-progress .summary-meter {
    width: 100%;
}
.team-learning-progress small {
    color: #6b7280;
    font-size: 12px;
}

.role-page-hero {
    border: 1px solid var(--line);
    border-radius: 16px;
    background:
        radial-gradient(circle at 88% 14%, rgba(46, 107, 251, .12), transparent 28%),
        #fff;
    box-shadow: 0 16px 45px rgba(15, 23, 42, .05);
    padding: 28px 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.role-page-hero h2 {
    margin: 4px 0 8px;
    font-size: 30px;
    line-height: 1.1;
}
.role-page-hero p {
    color: var(--muted);
    margin: 0;
    font-size: 15px;
}
.role-hero-illustration {
    width: min(360px, 36vw);
    min-height: 118px;
    border-radius: 18px;
    background:
        linear-gradient(135deg, rgba(46, 107, 251, .09), rgba(139, 92, 246, .08)),
        #fbfcff;
    border: 1px solid #dbe6ff;
    display: grid;
    gap: 12px;
    padding: 16px;
    flex: 0 0 auto;
}
.role-hero-visual-card {
    display: flex;
    align-items: center;
    gap: 12px;
}
.role-hero-visual-card > span {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #2e6bfb;
    color: #fff;
    font-size: 22px;
    box-shadow: 0 14px 28px rgba(46, 107, 251, .22);
}
.role-hero-visual-card strong,
.role-hero-visual-card small {
    display: block;
}
.role-hero-visual-card strong {
    color: #060a3d;
    font-size: 16px;
    font-weight: 600;
}
.role-hero-visual-card small {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}
.role-hero-visual-pills {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}
.role-hero-visual-pills em {
    min-height: 34px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: #fff;
    border: 1px solid #e5e9f2;
    color: #2e6bfb;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
}
.role-section {
    margin-top: 18px;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: #fff;
    padding: 22px;
    box-shadow: 0 16px 45px rgba(15, 23, 42, .045);
}
.role-section-primary { border-top: 4px solid #2e6bfb; }
.role-section-learning { border-top: 4px solid #8b5cf6; }
.role-section-assignments { border-top: 4px solid #16a34a; }
.role-section-additional { border-top: 4px solid #f59e0b; }
.role-section-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}
.role-section-head-between {
    justify-content: space-between;
    align-items: flex-start;
}
.role-section-title-inline {
    display: flex;
    align-items: center;
    gap: 14px;
}
.role-section-head h2 {
    margin: 0;
    font-size: 20px;
}
.role-section-head p {
    color: var(--muted);
    margin: 4px 0 0;
    font-size: 14px;
}
.role-section-icon {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    color: #fff;
    font-size: 22px;
    flex: 0 0 auto;
}
.role-section-icon-primary { background: #2e6bfb; }
.role-section-icon-learning { background: #8b5cf6; }
.role-section-icon-assignments { background: #16a34a; }
.role-section-icon-additional { background: #f59e0b; }
.admin-role-form {
    display: grid;
    gap: 18px;
}
.admin-role-form-hero {
    margin-bottom: 18px;
}
.admin-role-form-section {
    margin-top: 0;
}
.admin-role-form .form-label {
    color: #64748b;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
}
.admin-role-form .form-control,
.admin-role-form .form-select {
    border-color: #dbe3ef;
    border-radius: 12px;
    color: #0f172a;
    min-height: 44px;
}
.admin-role-form textarea.form-control {
    min-height: auto;
}
.admin-role-form .form-control:focus,
.admin-role-form .form-select:focus {
    border-color: #2e6bfb;
    box-shadow: 0 0 0 .2rem rgba(46, 107, 251, .12);
}
.admin-role-form-split {
    align-items: stretch;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
}
.admin-role-form-split .role-section {
    height: 100%;
}
.admin-role-form-actions {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: 0 16px 45px rgba(15, 23, 42, .045);
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding: 16px;
}
.admin-role-detail-section {
    margin-top: 0;
}
.primary-role-grid {
    display: grid;
    grid-template-columns: minmax(220px, .95fr) minmax(260px, 1.15fr) minmax(260px, 1fr);
    gap: 16px;
}
.admin-role-overview-grid {
    align-items: stretch;
}
.admin-role-summary-card {
    min-height: 250px;
}
.admin-role-summary-badges {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
}
.primary-role-card,
.role-info-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 18px;
}
.primary-role-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 230px;
}
.primary-role-badge-icon {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    background: #edf3ff;
    color: #2e6bfb;
    display: grid;
    place-items: center;
    font-size: 34px;
    margin-bottom: 18px;
}
.primary-role-card h3,
.role-info-card h3,
.role-material-card h3 {
    margin: 0;
    font-size: 16px;
}
.primary-role-card p {
    color: var(--muted);
    margin: 10px 0 18px;
    max-width: 260px;
}
.role-soft-badge {
    border-radius: 999px;
    background: #edf3ff;
    color: #2e6bfb;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 12px;
}
.role-duty-list {
    display: grid;
    gap: 0;
}
.role-duty-row {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #172033;
    padding: 11px 0;
    border-bottom: 1px solid var(--line);
}
.role-duty-row:last-child {
    border-bottom: 0;
}
.role-duty-row i {
    color: #2e6bfb;
    font-size: 17px;
}
.role-kpi-stack {
    display: grid;
    gap: 10px;
}
.role-kpi-card {
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fbfcff;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.role-kpi-card span {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #edf3ff;
    color: #2e6bfb;
    font-size: 18px;
}
.role-kpi-card small,
.role-kpi-card strong {
    display: block;
}
.role-kpi-card small {
    color: var(--muted);
}
.role-kpi-card strong {
    font-size: 24px;
    color: #060a3d;
}
.role-learning-progress,
.role-assignment-stats {
    min-width: min(340px, 100%);
}
.role-learning-progress small,
.role-learning-progress strong,
.role-assignment-stats span {
    display: block;
}
.role-learning-progress small {
    color: #060a3d;
}
.role-learning-progress strong {
    color: #060a3d;
    margin: 6px 0;
}
.role-progress-row {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 12px;
}
.role-progress-row small {
    color: var(--muted);
}
.role-progress-row b {
    color: #060a3d;
    font-weight: 600;
}
.role-learning-tabs {
    border-bottom: 1px solid var(--line);
    margin-bottom: 16px;
}
.role-learning-tabs .nav-link {
    border: 0;
    color: #52628a;
    font-weight: 500;
    padding: 12px 22px;
}
.role-learning-tabs .nav-link.active {
    color: #7c3aed;
    border-bottom: 2px solid #8b5cf6;
    background: transparent;
}
.admin-role-learning-stats {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}
.admin-role-learning-stats span {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 11px;
}
.role-material-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
}
.admin-role-material-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.role-material-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: #fff;
    padding: 16px;
    min-height: 190px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.admin-role-material-card {
    min-height: 250px;
}
.admin-role-material-note {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.45;
    margin: 0;
}
.role-material-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}
.role-material-main p {
    color: var(--muted);
    margin: 6px 0 0;
    font-size: 13px;
}
.role-material-main p span {
    margin: 0 5px;
}
.role-material-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    font-size: 18px;
    flex: 0 0 auto;
}
.role-material-icon-video { background: #fee2e2; color: #dc2626; }
.role-material-icon-pdf { background: #fee2e2; color: #dc2626; }
.role-material-icon-google_sheet { background: #dcfce7; color: #16a34a; }
.role-material-icon-google_doc { background: #dbeafe; color: #2563eb; }
.role-material-icon-ppt { background: #fef3c7; color: #f59e0b; }
.role-material-icon-link { background: #ede9fe; color: #7c3aed; }
.role-material-progress {
    margin-top: auto;
}
.role-material-progress small {
    color: var(--muted);
    margin-top: 7px;
    display: block;
}
.role-assignment-stats {
    display: grid;
    grid-template-columns: repeat(2, auto);
    justify-content: end;
    align-items: center;
    gap: 8px 18px;
}
.role-assignment-stats > span {
    color: #060a3d;
    font-weight: 500;
    font-size: 13px;
}
.role-assignment-stats .role-progress-row {
    grid-column: 1 / -1;
    grid-template-columns: auto 1fr auto;
}
.role-assignment-table-wrap {
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
}
.role-assignment-table {
    margin: 0;
}
.role-assignment-table thead th {
    background: #f8fafc;
    color: #52628a;
    border-bottom: 1px solid var(--line);
    font-weight: 600;
    padding: 13px 16px;
}
.role-assignment-table td {
    padding: 14px 16px;
    border-color: var(--line);
}
.role-assignment-table td > strong,
.role-assignment-table td > small {
    display: block;
}
.role-assignment-title {
    display: flex;
    align-items: center;
    gap: 12px;
}
.role-assignment-title > span {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #ede9fe;
    color: #7c3aed;
    font-size: 18px;
}
.role-assignment-title strong,
.role-assignment-title small {
    display: block;
}
.role-assignment-title small {
    color: var(--muted);
    margin-top: 3px;
}
.role-table-progress {
    min-width: 120px;
}
.role-table-progress span {
    color: #060a3d;
    font-size: 13px;
    display: block;
    margin-bottom: 6px;
}
.role-additional-accordion {
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
}
.role-additional-accordion .accordion-item {
    border: 0;
    border-bottom: 1px solid var(--line);
}
.role-additional-accordion .accordion-item:last-child {
    border-bottom: 0;
}
.role-additional-accordion .accordion-button {
    box-shadow: none;
    background: #fff;
    color: #060a3d;
    padding: 16px 18px;
    display: flex;
    gap: 12px;
}
.role-additional-accordion .accordion-button span {
    font-weight: 600;
}
.role-additional-accordion .accordion-button em {
    font-style: normal;
    border-radius: 999px;
    background: #fff7ed;
    color: #f97316;
    padding: 4px 9px;
    font-size: 12px;
    margin-right: auto;
}
.role-additional-accordion .accordion-button:not(.collapsed) {
    background: #fffaf3;
}
.role-additional-accordion .accordion-body {
    padding: 0 18px 18px;
}
.role-additional-accordion .accordion-body > p {
    color: var(--muted);
    margin: 0 0 14px;
}
.additional-role-detail-grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr .8fr;
    gap: 16px;
}
.additional-role-detail-grid > div {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 14px;
    background: #fff;
}
.additional-role-detail-grid h4 {
    font-size: 14px;
    margin: 0 0 8px;
}
.admin-role-bottom-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.admin-role-bottom-section {
    margin-top: 18px;
}
.admin-role-copy-grid {
    display: grid;
    gap: 14px;
}
.admin-role-copy-grid > div {
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
}
.admin-role-copy-grid h3 {
    color: #060a3d;
    font-size: 15px;
    font-weight: 650;
    margin: 0 0 8px;
}
.admin-role-copy-grid p {
    color: #475569;
    font-size: 14px;
    line-height: 1.55;
    margin: 0;
    white-space: pre-line;
}
.admin-role-member-list {
    display: grid;
    gap: 10px;
}
.admin-role-member-row {
    align-items: center;
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: inherit;
    display: flex;
    gap: 12px;
    padding: 12px;
    text-decoration: none;
}
.admin-role-member-row:hover {
    background: #f8fbff;
}
.admin-role-member-row strong,
.admin-role-member-row small {
    display: block;
}
.admin-role-member-row strong {
    color: #060a3d;
    font-size: 14px;
    font-weight: 650;
}
.admin-role-member-row small {
    color: var(--muted);
    font-size: 12px;
}
.admin-role-member-row em {
    background: #edf3ff;
    border-radius: 999px;
    color: #2e6bfb;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    margin-left: auto;
    padding: 5px 10px;
}
.additional-kpi-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid var(--line);
}
.additional-kpi-row:last-child {
    border-bottom: 0;
}
.additional-kpi-row span {
    color: var(--muted);
}
.additional-kpi-row strong {
    color: #060a3d;
}
.role-video-modal .modal-content {
    border: 0;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 28px 80px rgba(15, 23, 42, .28);
}
.role-video-modal .modal-header {
    align-items: flex-start;
    border-bottom: 1px solid var(--line);
    padding: 18px 20px;
}
.role-video-modal .modal-title {
    color: #060a3d;
    font-size: 20px;
    margin: 2px 0 0;
}
.role-video-modal .modal-body {
    padding: 0;
    background: #0f172a;
}
.role-video-modal-frame {
    aspect-ratio: 16 / 9;
    width: 100%;
    background: #0f172a;
}
.role-video-modal-frame iframe {
    border: 0;
    display: block;
    width: 100%;
    height: 100%;
}

.evaluation-detail-layout {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) 330px;
}
.evaluation-card {
    margin-bottom: 18px;
    overflow: hidden;
    padding: 24px 28px;
}
.evaluation-card-summary {
    background: linear-gradient(180deg, rgba(46, 107, 251, .035), #fff 72%);
    border-top: 4px solid #2e6bfb;
}
.evaluation-card-strengths,
.evaluation-card-improvements,
.evaluation-card-feedback,
.evaluation-card-action
{
    background: #fff;
}
.evaluation-card-calculation {
    background: linear-gradient(180deg, rgba(46, 107, 251, .04), #fff 72%);
    border-top: 4px solid #2e6bfb;
}
.evaluation-section-head {
    align-items: center;
    display: flex;
    gap: 14px;
    margin-bottom: 18px;
}
.evaluation-section-icon {
    border-radius: 12px;
    display: grid;
    flex: 0 0 auto;
    font-size: 20px;
    height: 44px;
    place-items: center;
    width: 44px;
}
.evaluation-icon-blue {
    background: #e9efff;
    color: #2e6bfb;
}
.evaluation-icon-green {
    background: #dcfce7;
    color: #16a34a;
}
.evaluation-icon-orange {
    background: #ffedd5;
    color: #f97316;
}
.evaluation-icon-purple {
    background: #ede9fe;
    color: #8b5cf6;
}
.evaluation-icon-slate {
    background: #f1f5f9;
    color: #334155;
}
.evaluation-section-head h2 {
    color: #060a3d;
    font-size: 20px;
    line-height: 1.2;
    margin: 0;
}
.evaluation-section-head p {
    color: #526174;
    margin: 4px 0 0;
}
.evaluation-criteria-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(170px, 1fr));
}
.evaluation-criterion-card {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .035);
    display: grid;
    gap: 12px;
    grid-template-columns: 44px minmax(0, 1fr);
    min-height: 96px;
    padding: 15px 16px;
    text-align: left;
}
.evaluation-criterion-icon {
    background: #e9efff;
    border-radius: 12px;
    color: #2e6bfb;
    display: grid;
    font-size: 20px;
    height: 44px;
    margin: 0;
    place-items: center;
    width: 44px;
}
.evaluation-criterion-copy {
    min-width: 0;
}
.evaluation-criterion-card h3 {
    color: #060a3d;
    font-size: 13px;
    line-height: 1.25;
    margin: 0 0 7px;
}
.evaluation-criterion-card strong {
    color: #060a3d;
    display: block;
    font-size: 24px;
    line-height: 1;
    margin-bottom: 0;
}
.evaluation-criterion-card strong em,
.evaluation-big-score em {
    color: #334155;
    font-size: .55em;
    font-style: normal;
    font-weight: 700;
}
.evaluation-criterion-card .summary-meter {
    grid-column: 1 / -1;
}
.evaluation-info-note {
    align-items: center;
    background: #f4f8ff;
    border: 1px solid #dbe8ff;
    border-radius: 12px;
    color: #334155;
    display: flex;
    gap: 10px;
    margin-top: 18px;
    padding: 13px 16px;
}
.evaluation-info-note i {
    color: #2e6bfb;
}
.evaluation-two-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.evaluation-check-list,
.evaluation-action-grid {
    list-style: none;
    margin: 0;
    padding: 0;
}
.evaluation-check-list li,
.evaluation-action-grid li {
    align-items: flex-start;
    color: #334155;
    display: flex;
    gap: 11px;
    line-height: 1.5;
    padding: 9px 0;
}
.evaluation-check-list li + li,
.evaluation-action-grid li + li {
    border-top: 1px solid rgba(226, 232, 240, .72);
}
.evaluation-check-green i {
    color: #16a34a;
}
.evaluation-check-orange i {
    color: #f97316;
    font-size: 24px;
    line-height: .8;
}
.evaluation-empty-copy {
    color: #64748b;
    margin: 0;
}
.evaluation-quote {
    align-items: flex-start;
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: #334155;
    display: flex;
    gap: 16px;
    padding: 18px 20px;
}
.evaluation-quote i {
    color: #8b5cf6;
    font-size: 28px;
    line-height: 1;
}
.evaluation-quote p {
    line-height: 1.65;
    margin: 0;
}
.evaluation-action-grid {
    column-gap: 28px;
    display: grid;
    grid-template-columns: 1fr;
}
.evaluation-action-grid i {
    color: #2e6bfb;
    font-size: 24px;
    line-height: .75;
}
.evaluation-weight-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 14px;
}
.evaluation-weight-grid div {
    align-items: center;
    background: #fbfcff;
    border: 1px solid var(--line);
    border-radius: 12px;
    display: flex;
    gap: 10px;
    padding: 12px;
}
.evaluation-weight-grid span {
    background: #2e6bfb;
    border-radius: 50%;
    height: 10px;
    width: 10px;
}
.evaluation-weight-grid strong {
    color: #060a3d;
    font-size: 13px;
    line-height: 1.2;
}
.evaluation-weight-grid small {
    color: #64748b;
    font-size: 12px;
    margin-left: auto;
}
.evaluation-formula {
    background: #f8fafc;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: #475569;
    font-size: 13px;
    line-height: 1.6;
    padding: 14px 16px;
    text-align: center;
}
.evaluation-confidential {
    align-items: center;
    color: #64748b;
    display: flex;
    font-size: 13px;
    gap: 8px;
    justify-content: center;
    margin: 6px 0 0;
}
.evaluation-detail-side {
    position: sticky;
    top: 18px;
}
.evaluation-score-panel {
    padding: 30px 24px;
    text-align: center;
}
.evaluation-score-label {
    color: #334155;
    display: block;
    font-weight: 700;
    margin-bottom: 12px;
}
.evaluation-big-score {
    background: linear-gradient(135deg, #085bcb 10%, #2e6bfb 56%, #00b8d9 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-size: 60px;
    font-weight: 750;
    letter-spacing: -2px;
    line-height: 1;
    margin-bottom: 12px;
}
.evaluation-score-panel > .badge {
    background: #eef4ff !important;
    border: 1px solid #cfe0ff;
    color: #085bcb !important;
    font-size: 13px;
    font-weight: 600;
    padding: 7px 14px;
}
.evaluation-gauge {
    margin: 26px auto 20px;
    max-width: 220px;
    position: relative;
}
.evaluation-gauge svg {
    display: block;
    height: auto;
    overflow: visible;
    width: 100%;
}
.evaluation-gauge-track,
.evaluation-gauge-value {
    fill: none;
    stroke-linecap: round;
    stroke-width: 14;
}
.evaluation-gauge-track {
    stroke: #e8edf5;
}
.evaluation-gauge-value {
    stroke: #2e6bfb;
    stroke-dasharray: 267;
}
.evaluation-gauge-needle {
    background: #2e6bfb;
    border-radius: 999px;
    bottom: 22px;
    height: 8px;
    left: 50%;
    position: absolute;
    transform: translateX(-6px) rotate(var(--gauge-rotation));
    transform-origin: 6px 4px;
    width: 72px;
}
.evaluation-gauge-needle::after {
    background: #2e6bfb;
    border-radius: 50%;
    content: "";
    height: 14px;
    left: -1px;
    position: absolute;
    top: -3px;
    width: 14px;
}
.evaluation-gauge-scale {
    bottom: 0;
    color: #060a3d;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    justify-content: space-between;
    left: 16px;
    position: absolute;
    right: 16px;
}
.evaluation-side-message {
    border-bottom: 1px solid var(--line);
    margin-top: 6px;
    padding-bottom: 22px;
}
.evaluation-side-message strong {
    color: #060a3d;
    display: block;
    font-size: 17px;
    margin-bottom: 8px;
}
.evaluation-side-message p {
    color: #64748b;
    font-size: 13px;
    line-height: 1.5;
    margin: 0;
}
.evaluation-detail-list {
    margin: 20px 0 24px;
    text-align: left;
}
.evaluation-detail-list div {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(96px, .6fr) minmax(0, 1fr);
    padding: 11px 0;
}
.evaluation-detail-list dt {
    align-items: center;
    color: #64748b;
    display: flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
}
.evaluation-detail-list dt i {
    color: #64748b;
    font-size: 15px;
}
.evaluation-detail-list dd {
    color: #060a3d;
    font-size: 13px;
    font-weight: 600;
    margin: 0;
    text-align: right;
}

@media (max-width: 1200px) {
    .admin-clean-kpi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .admin-performance-review-row {
        align-items: start;
        grid-template-columns: minmax(240px, 1.2fr) minmax(200px, 1fr) minmax(140px, .7fr) auto;
    }
    .admin-performance-rating,
    .admin-performance-reviewer,
    .admin-performance-actions {
        grid-column: auto;
    }
    .admin-evaluation-layout {
        grid-template-columns: 1fr;
    }
    .admin-evaluation-sidebar {
        position: static;
    }
    .admin-evaluation-score-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .evaluation-detail-layout {
        grid-template-columns: 1fr;
    }
    .evaluation-detail-side {
        position: static;
    }
    .evaluation-score-panel {
        text-align: left;
    }
    .evaluation-score-panel .badge {
        margin-bottom: 0;
    }
    .evaluation-criteria-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .evaluation-weight-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .activity-menu {
        width: calc(100vw - 20px);
    }
    .activity-menu-item,
    .activity-center-row {
        align-items: flex-start;
        grid-template-columns: 38px minmax(0, 1fr);
    }
    .activity-menu-item .btn,
    .activity-center-row .btn {
        grid-column: 2;
        justify-self: flex-start;
    }
    .activity-center-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
    .admin-performance-toolbar,
    .admin-performance-review-row,
    .admin-evaluation-copy-grid,
    .admin-evaluation-project-list article {
        grid-template-columns: 1fr;
    }
    .admin-evaluation-score-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .admin-performance-actions {
        justify-content: flex-start;
    }
    .admin-performance-review-row {
        gap: 12px;
        padding: 16px;
    }
    .admin-performance-rating,
    .admin-performance-reviewer {
        align-items: flex-start;
    }
    .admin-evaluation-meta div {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .admin-evaluation-meta dd {
        text-align: left;
    }
    .evaluation-card {
        padding: 20px;
    }
    .evaluation-criteria-grid,
    .evaluation-two-grid,
    .evaluation-action-grid,
    .evaluation-weight-grid {
        grid-template-columns: 1fr;
    }
    .evaluation-criterion-card {
        min-height: auto;
    }
    .evaluation-detail-list div {
        grid-template-columns: 1fr;
        gap: 3px;
    }
    .evaluation-detail-list dd {
        text-align: left;
    }
    .evaluation-big-score {
        font-size: 46px;
    }
}

@media (max-width: 992px) {
    .suggestion-hero {
        grid-template-columns: 1fr;
    }
    .suggestion-hero-visual {
        display: none;
    }
    .suggestion-hero-points {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .suggestion-summary-grid-lively {
        gap: 12px;
    }
    .suggestion-summary-card-lively,
    .suggestion-summary-card-lively:first-child,
    .suggestion-summary-card-lively:last-child {
        border: 1px solid var(--line);
        border-radius: 14px;
    }
    .shared-suggestion-card-lively,
    .suggestion-celebration-strip {
        grid-template-columns: 1fr;
    }
    .ideas-kpi-grid {
        grid-template-columns: 1fr;
    }
    .admin-ideas-kpi-grid,
    .admin-ideas-approved-grid,
    .admin-ideas-priority-grid {
        grid-template-columns: 1fr;
    }
    .ideas-row {
        grid-template-columns: 52px minmax(0, 1fr);
    }
    .admin-idea-card-review,
    .admin-idea-card-approved-flat,
    .admin-ideas-table-head,
    .team-idea-table-row,
    .admin-idea-compact-row {
        grid-template-columns: 1fr;
    }
    .admin-ideas-table-head {
        display: none;
    }
    .admin-ideas-attributes {
        grid-template-columns: 1fr;
    }
    .admin-idea-title-cell {
        grid-template-columns: 44px minmax(0, 1fr);
    }
    .admin-idea-action-cell {
        justify-content: flex-start;
    }
    .admin-idea-side {
        align-content: start;
    }
    .admin-ideas-member-toggle {
        align-items: flex-start;
        flex-direction: column;
    }
    .admin-ideas-member-summary {
        justify-content: flex-start;
        margin-left: 0;
        width: 100%;
    }
    .admin-idea-actions,
    .admin-idea-compact-badges {
        justify-content: flex-start;
    }
    .ideas-row-status,
    .ideas-row-feedback,
    .ideas-row-details {
        grid-column: 2 / -1;
    }
    .ideas-media-view {
        grid-template-columns: 1fr;
    }
    .ideas-detail-facts {
        grid-template-columns: 1fr;
    }
    .ideas-admin-filter {
        grid-template-columns: 1fr;
    }
    .suggestion-submit-layout {
        grid-template-columns: 1fr;
    }
    .suggestion-submit-side {
        display: grid;
        grid-template-columns: 220px minmax(0, 1fr);
    }
    .suggestion-submit-side h3,
    .suggestion-submit-checklist,
    .suggestion-submit-callout {
        grid-column: 2;
    }
    .suggestion-submit-callout {
        margin-top: 0;
    }
    .shared-suggestion-card-lively .shared-suggestion-footer {
        grid-column: auto;
    }
    .login-page {
        grid-template-columns: 1fr;
    }
    .login-panel {
        min-height: auto;
        padding: 32px 22px 40px;
    }
    .login-panel .talent-brand {
        margin-bottom: 42px;
    }
    .login-copy,
    .login-form {
        max-width: none;
    }
    .login-panel .login-copy h1 {
        white-space: normal;
    }
    .login-visual {
        min-height: 420px;
        padding: 42px 24px;
    }
    .login-hero-copy {
        margin-bottom: 10px;
    }
    .orientation-platform-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 575px) {
    .role-section {
        padding: 16px;
    }
    .role-section-title-inline,
    .role-section-head {
        align-items: flex-start;
    }
    .role-material-grid {
        grid-template-columns: 1fr;
    }
    .role-assignment-stats {
        grid-template-columns: 1fr;
    }
    .role-assignment-stats .role-progress-row {
        grid-template-columns: 1fr auto;
    }
    .role-assignment-stats .role-progress-row small {
        grid-column: 1 / -1;
    }
    .role-learning-tabs .nav-link {
        padding-left: 10px;
        padding-right: 10px;
    }
    .login-panel .talent-brand .brand-mark {
        width: 58px;
        height: 58px;
    }
    .login-panel .talent-brand strong {
        font-size: 19px;
    }
    .login-panel .talent-brand small {
        font-size: 13.5px;
    }
    .login-panel .login-copy h1 {
        font-size: 34px;
        white-space: nowrap;
    }
    .login-copy p {
        font-size: 15px;
    }
    .login-visual {
        min-height: 320px;
    }
}

@media (max-width: 992px) {
    .admin-clean-hero {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
    }
    .admin-hero-status {
        text-align: left;
        width: 100%;
    }
    .admin-clean-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .admin-watchlist-row {
        align-items: flex-start;
        grid-template-columns: 1fr 1fr;
    }
    .admin-watchlist-row .person-cell {
        grid-column: 1 / -1;
    }
    .admin-action-grid,
    .admin-action-grid-wide {
        grid-template-columns: 1fr;
        margin-left: 0;
    }
    .admin-pin-manager-head {
        align-items: stretch;
        flex-direction: column;
    }
    .admin-pin-picker,
    .admin-pinned-grid {
        grid-template-columns: 1fr;
    }
    .login-page, .signup-page { grid-template-columns: 1fr; }
    .login-visual, .signup-visual { min-height: 360px; }
    .signup-panel { overflow: visible; }
    .signup-intro { flex-direction: column; align-items: flex-start; }
    .signup-steps { justify-content: start; }
    .signup-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .review-grid { grid-template-columns: 1fr; }
    .app-shell { grid-template-columns: 1fr; }
    .sidebar {
        position: relative;
        min-height: auto;
        max-height: none;
        padding: 18px;
    }
    .sidebar-brand-copy strong { font-size: 18.5px; }
    .sidebar-nav {
        max-height: none;
        overflow: visible;
    }
    .sidebar-profile {
        display: block;
    }
    .content { padding: 18px; }
    .admin-roles-summary-row {
        align-items: stretch;
        flex-direction: column;
    }
    .role-page-hero,
    .roles-admin-hero,
    .role-section-head-between {
        flex-direction: column;
        align-items: flex-start;
    }
    .role-hero-illustration {
        display: none;
    }
    .primary-role-grid,
    .additional-role-detail-grid,
    .admin-role-overview-grid,
    .admin-role-bottom-grid {
        grid-template-columns: 1fr;
    }
    .role-material-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .admin-role-row {
        align-items: stretch;
        grid-template-columns: 1fr;
    }
    .admin-role-actions {
        justify-content: flex-start;
    }
    .role-learning-progress,
    .role-assignment-stats {
        width: 100%;
        min-width: 0;
    }
    .role-assignment-stats {
        justify-content: stretch;
    }
    .filter-bar, .dashboard-filter-panel, .project-filter-bar, .team-project-toolbar, .roles-toolbar, .team-appraisal-toolbar, .ym-project-filters { grid-template-columns: 1fr; }
    .ym-project-filters.ym-admin-project-filters { grid-template-columns: 1fr; }
    .learning-assignment-layout,
    .learning-assignment-row {
        grid-template-columns: 1fr;
    }
    .learning-assignment-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .topbar, .panel-header, .form-actions, .task-card-main, .team-hero { flex-direction: column; align-items: stretch; }
    .summary-board { grid-template-columns: 1fr; }
    .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .orientation-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .smart-dashboard-hero {
        flex-direction: column;
        align-items: flex-start;
    }
    .smart-actions {
        justify-content: flex-start;
    }
    .smart-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .orientation-command-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .orientation-admin-action-grid,
    .orientation-recent-list {
        grid-template-columns: 1fr;
    }
    .orientation-command-completion {
        grid-column: 1 / -1;
    }
    .smart-dashboard-grid,
    .smart-bottom-grid {
        grid-template-columns: 1fr;
    }
    .admin-focus-action-layout {
        grid-template-columns: 1fr;
    }
    .compact-activity { grid-template-columns: 1fr; }
    .project-status-tabs, .team-project-summary, .ym-project-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .project-row-card { grid-template-columns: 1fr; }
    .project-row-details { justify-items: stretch; }
    .project-row-badges { justify-content: start; }
    .project-row-date { min-width: 0; }
    .team-kpi-grid, .roles-summary-grid, .team-appraisal-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ym-project-focus-card,
    .ym-project-row,
    .ym-project-row.ym-admin-project-row.ym-admin-project-row-grouped,
    .ym-admin-review-item,
    .ym-admin-compact-project,
    .ym-completed-row,
    .ym-project-detail-summary,
    .ym-project-overview-grid,
    .ym-project-activity-item {
        grid-template-columns: 1fr;
    }
    .ym-project-detail-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .project-detail-metric-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 18px;
    }
    .performance-latest-grid,
    .performance-feedback-grid {
        grid-template-columns: 1fr;
    }
    .performance-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .performance-average-card {
        grid-column: span 2;
    }
    .performance-review-row {
        grid-template-columns: 48px minmax(0, 1fr);
    }
    .performance-review-score,
    .performance-review-row time,
    .performance-review-row > i {
        grid-column: 2;
    }
    .performance-review-row time {
        text-align: left;
    }
    .performance-section-head-between,
    .performance-review-meta {
        align-items: flex-start;
        flex-direction: column;
    }
    .project-detail-metric-block:nth-child(2),
    .project-detail-progress-block {
        border-right: 0;
    }
    .project-detail-progress-block {
        padding-left: 12px;
    }
    .ym-project-detail-actions {
        justify-content: flex-start;
    }
    .ym-project-overview-grid > div + div {
        border-left: 0;
        border-top: 1px solid var(--line);
    }
    .ym-project-update-actions {
        align-items: stretch;
        flex-direction: column;
    }
    .ym-project-activity-item time {
        text-align: left;
    }
    .ym-project-focus-progress {
        border-left: 0;
        border-top: 1px solid var(--line);
        padding-left: 0;
        padding-top: 14px;
    }
    .ym-project-row-action {
        justify-content: flex-start;
    }
    .ym-admin-project-member-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .ym-admin-project-member-stats {
        justify-content: flex-start;
    }
    .ym-admin-compact-project {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .ym-admin-compact-project-tags,
    .ym-admin-compact-actions {
        justify-content: flex-start;
    }
    .ym-admin-review-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .team-hero-score { text-align: left; }
    .profile-basic-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .profile-basic-address {
        grid-column: span 2;
    }
    .profile-edit-grid,
    .profile-edit-doc-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .profile-edit-two-column {
        grid-template-columns: 1fr;
    }
    .profile-edit-address,
    .profile-edit-wide {
        grid-column: span 2;
    }
    .priority-item,
    .activity-item,
    .attention-item,
    .suggestion-progress,
    .suggestion-compact-item,
    .focus-project-footer,
    .orientation-dashboard-card,
    .team-project-card,
    .team-suggestion-card {
        grid-template-columns: 1fr;
    }
    .deadline-row {
        align-items: stretch;
        flex-direction: column;
    }
    .deadline-meta {
        justify-content: start;
    }
}

@media (max-width: 640px) {
    .admin-clean-kpi-grid,
    .admin-watchlist-row {
        grid-template-columns: 1fr;
    }
    .summary-grid { grid-template-columns: 1fr; }
    .summary-rate-inline { grid-column: 1 / -1; }
    .suggestion-summary-grid, .admin-suggestion-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-suggestion-toolbar { grid-template-columns: 1fr; }
    .suggestion-form-layout { grid-template-columns: 1fr; }
    .suggestion-submit-panel {
        padding: 18px 16px 0;
    }
    .suggestion-submit-head,
    .suggestion-submit-footer {
        align-items: stretch;
        grid-template-columns: 1fr;
    }
    .suggestion-submit-head {
        flex-wrap: wrap;
    }
    .suggestion-submit-back {
        width: 100%;
    }
    .suggestion-submit-grid,
    .suggestion-submit-two-grid,
    .suggestion-benefit-options {
        grid-template-columns: 1fr;
    }
    .suggestion-media-grid {
        grid-template-columns: 1fr;
    }
    .suggestion-submit-side {
        display: flex;
    }
    .suggestion-submit-side h3,
    .suggestion-submit-checklist,
    .suggestion-submit-callout {
        grid-column: auto;
    }
    .suggestion-submit-footer p {
        justify-content: flex-start;
    }
    .suggestion-detail-layout,
    .suggestion-assignment-grid {
        grid-template-columns: 1fr;
    }
    .appraisal-summary-grid,
    .appraisal-score-grid,
    .appraisal-score-input-grid,
    .appraisal-reference-grid,
    .team-appraisal-summary,
    .roles-summary-grid,
    .people-summary-grid,
    .people-profile-summary,
    .people-doc-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .roles-admin-hero {
        padding: 18px;
    }
    .roles-admin-hero h2 {
        font-size: 22px;
    }
    .admin-roles-add-btn {
        width: 100%;
    }
    .admin-role-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .admin-role-material-grid {
        grid-template-columns: 1fr;
    }
    .appraisal-toolbar,
    .team-appraisal-toolbar,
    .roles-toolbar,
    .people-toolbar,
    .appraisal-detail-layout,
    .appraisal-form-layout,
    .people-profile-layout {
        grid-template-columns: 1fr;
    }
    .appraisal-score-panel,
    .appraisal-guidance-card {
        position: static;
    }
    .suggestion-detail-hero {
        flex-direction: column;
    }
    .quick-action-grid, .admin-action-grid-side, .insight-grid, .chart-legend, .team-kpi-grid, .admin-kpi-grid, .suggestion-mini-stats { grid-template-columns: 1fr; }
    .smart-kpi-grid,
    .smart-mini-grid {
        grid-template-columns: 1fr;
    }
    .orientation-summary-grid {
        grid-template-columns: 1fr;
    }
    .orientation-command-grid {
        grid-template-columns: 1fr;
    }
    .orientation-admin-action-grid,
    .orientation-recent-list {
        grid-template-columns: 1fr;
    }
    .orientation-action-row {
        grid-template-columns: 42px minmax(0, 1fr) 18px;
    }
    .orientation-action-meta {
        grid-column: 2 / -1;
        text-align: left;
    }
    .orientation-command-completion {
        grid-template-columns: 48px minmax(0, 1fr);
    }
    .orientation-command-completion .orientation-command-progress {
        grid-column: 1 / -1;
    }
    .orientation-summary-card-wide {
        grid-column: span 1;
    }
    .orientation-summary-card-wide .summary-meter {
        width: 100%;
        flex: 1 1 100%;
    }
    .smart-attention-item,
    .smart-health-row {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }
    .priority-item .btn { width: 100%; }
    .summary-rate-footer { grid-template-columns: 46px 1fr; }
    .summary-meter { grid-column: 1 / -1; }
    .team-hero-profile, .focus-project-main, .orientation-dashboard-main, .onboarding-hero { flex-direction: column; align-items: flex-start; }
    .team-project-meta { justify-content: start; }
    .orientation-dashboard-actions .btn,
    .orientation-dashboard-actions form {
        width: 100%;
    }
    .orientation-page-head,
    .orientation-guidelines-head,
    .orientation-action-panel,
    .orientation-submit-panel {
        flex-direction: column;
        align-items: stretch;
    }
    .orientation-status-card {
        min-width: 0;
    }
    .orientation-progress-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0;
    }
    .orientation-progress-main,
    .orientation-progress-stat {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        padding: 14px 12px;
    }
    .orientation-progress-stat:nth-child(3),
    .orientation-progress-stat:nth-child(4) {
        border-bottom: 0;
    }
    .orientation-guide-card summary {
        grid-template-columns: 44px minmax(0, 1fr) auto;
    }
    .orientation-item-count,
    .orientation-guide-caret {
        display: none;
    }
    .orientation-guide-status {
        justify-self: end;
    }
    .signup-top, .signup-submit { flex-direction: column; align-items: stretch; }
    .signup-progress { grid-template-columns: 1fr; }
    .signup-nav { flex-direction: column-reverse; align-items: stretch; }
    .upload-grid { grid-template-columns: 1fr; }
    .project-status-tabs, .team-project-summary, .ym-project-summary-grid { grid-template-columns: 1fr; }
    .learning-assignment-summary,
    .learning-type-grid {
        grid-template-columns: 1fr;
    }
    .learning-employee-card {
        grid-template-columns: 18px 40px minmax(0, 1fr);
    }
    .learning-employee-card > i {
        display: none;
    }
    .learning-assignment-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }
    .learning-assignment-actions .btn {
        width: 100%;
    }
    .ym-project-detail-metrics {
        grid-template-columns: 1fr;
    }
    .project-detail-card {
        padding: 20px;
    }
    .performance-section {
        padding: 20px;
    }
    .performance-section-head,
    .performance-section-title-inline,
    .performance-encouragement,
    .performance-feedback-copy {
        align-items: flex-start;
    }
    .performance-score-box {
        grid-template-columns: 1fr;
    }
    .performance-summary-grid {
        grid-template-columns: 1fr;
    }
    .performance-average-card {
        grid-column: auto;
    }
    .performance-score-box > div + div {
        border-left: 0;
        border-top: 1px solid var(--line);
        padding-left: 0;
        padding-top: 18px;
    }
    .performance-review-row {
        padding: 16px;
    }
    .project-detail-summary-top,
    .project-detail-title-lockup,
    .project-detail-simple-actions {
        align-items: flex-start;
        flex-direction: column;
    }
    .project-detail-metric-row,
    .project-detail-review-box,
    .project-detail-progress-block > div,
    .project-detail-status-form,
    .project-detail-admin-actions {
        grid-template-columns: 1fr;
    }
    .project-detail-metric-block,
    .project-detail-progress-block {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        padding: 0 0 16px;
    }
    .project-detail-progress-block {
        border-bottom: 0;
    }
    .project-detail-simple-actions .btn {
        width: 100%;
    }
    .project-detail-status-form .btn,
    .project-detail-admin-actions .btn {
        width: 100%;
    }
    .ym-project-detail-title,
    .ym-project-detail-actions,
    .ym-project-attachments {
        align-items: flex-start;
        flex-direction: column;
    }
    .ym-project-section-head-between {
        align-items: stretch;
        flex-direction: column;
    }
    .ym-project-collapse-summary.ym-project-section-head-between {
        align-items: center;
        flex-direction: row;
    }
    .ym-project-collapse-summary .ym-project-section-title-inline {
        min-width: 0;
    }
    .ym-project-section-head-between .btn {
        width: 100%;
    }
    .ym-project-stat {
        min-height: 96px;
    }
    .project-card-actions { justify-content: stretch; }
    .project-card-actions .btn { flex: 1 1 100%; }
    .suggestion-summary-grid, .admin-suggestion-summary { grid-template-columns: 1fr; }
    .team-appraisal-summary { grid-template-columns: 1fr; }
    .appraisal-summary-grid,
    .appraisal-score-grid,
    .appraisal-score-input-grid,
    .appraisal-reference-grid,
    .appraisal-feedback-grid {
        grid-template-columns: 1fr;
    }
    .appraisal-detail-hero,
    .appraisal-reference-project,
    .people-profile-hero,
    .people-profile-main,
    .orientation-template-hero,
    .orientation-queue-head,
    .orientation-template-section-head {
        flex-direction: column;
        align-items: flex-start;
    }
    .orientation-queue-count {
        width: 100%;
        justify-content: center;
    }
    .orientation-template-section-title {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
    .orientation-template-actions,
    .orientation-template-actions form,
    .orientation-template-actions .btn,
    .orientation-assignment-toolbar,
    .orientation-assignment-toolbar .btn {
        width: 100%;
    }
    .orientation-assignment-toolbar {
        flex-direction: column;
        align-items: stretch;
    }
    .orientation-employee-grid {
        grid-template-columns: 1fr;
    }
    .people-summary-grid,
    .roles-summary-grid,
    .people-profile-summary,
    .people-doc-grid {
        grid-template-columns: 1fr;
    }
    .shared-suggestion-main,
    .shared-suggestion-footer {
        grid-template-columns: 1fr;
        align-items: flex-start;
    }
    .shared-suggestion-footer {
        flex-direction: column;
    }
    .shared-suggestion-title-row {
        flex-direction: column;
    }
    .role-learning-editor-head,
    .role-learning-row,
    .profile-reject-form {
        flex-direction: column;
        grid-template-columns: 1fr;
    }
    .role-learning-editor-head .btn,
    .role-learning-row .team-icon-action,
    .profile-reject-form .btn {
        width: 100%;
    }
    .profile-skill-head,
    .profile-skill-row {
        grid-template-columns: minmax(130px, 1.3fr) repeat(4, minmax(48px, 1fr));
        padding-left: 10px;
        padding-right: 10px;
    }
    .profile-skill-head {
        font-size: 11.5px;
    }
    .profile-skill-row strong {
        font-size: 12.5px;
    }
    .profile-completion-modal-list {
        grid-template-columns: 1fr;
    }
    .onboarding-tabs,
    .onboarding-tabs a {
        width: 100%;
    }
    .onboarding-overview-grid,
    .onboarding-policy-grid,
    .onboarding-role-grid {
        grid-template-columns: 1fr;
    }
    .onboarding-role-block-wide {
        grid-column: auto;
    }
    .onboarding-progress-card {
        min-width: 0;
        width: 100%;
    }
    .orientation-progress-grid {
        grid-template-columns: 1fr;
    }
    .orientation-progress-main,
    .orientation-progress-stat,
    .orientation-progress-stat:nth-child(3) {
        border-bottom: 1px solid var(--line);
    }
    .orientation-progress-stat:nth-child(4) {
        border-bottom: 0;
    }
    .orientation-progress-main {
        padding-left: 12px;
    }
    .orientation-progress-main strong {
        font-size: 30px;
    }
    .orientation-guide-card summary {
        grid-template-columns: 42px minmax(0, 1fr);
        align-items: flex-start;
    }
    .orientation-guide-status {
        grid-column: 2;
        justify-self: start;
    }
    .orientation-guide-body {
        padding: 16px;
    }
    .orientation-check-grid {
        grid-template-columns: 1fr;
    }
    .orientation-platform-grid {
        grid-template-columns: 1fr;
    }
    .orientation-link-card {
        grid-template-columns: 26px minmax(0, 1fr);
    }
    .orientation-link-card > i:last-child {
        display: none;
    }
    .profile-hero-card,
    .profile-hero-main {
        flex-direction: column;
        align-items: flex-start;
    }
    .profile-hero-actions,
    .profile-hero-actions .btn,
    .profile-completion-header,
    .profile-completion-header .btn {
        width: 100%;
    }
    .profile-hero-actions,
    .profile-completion-header {
        align-items: stretch;
        flex-direction: column;
    }
    .profile-completion-row,
    .profile-basic-grid,
    .profile-edit-grid,
    .profile-edit-doc-grid,
    .profile-edit-two-column,
    .profile-field-grid,
    .profile-card-grid,
    .profile-detail-layout,
    .profile-accordion-grid {
        grid-template-columns: 1fr;
    }
    .profile-skill-bar-row,
    .profile-skill-editor-row {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .profile-detail-stack {
        grid-template-rows: none;
    }
    .profile-detail-stack .profile-section-card {
        display: block;
    }
    .profile-skill-view-head {
        display: none;
    }
    .profile-skill-editor-scale {
        display: none;
    }
    .profile-skill-choice small {
        font-size: 10.5px;
    }
    .profile-section-body {
        margin-left: 0;
    }
    .profile-document-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .profile-completion-score {
        border-right: 0;
        border-bottom: 1px solid var(--line);
        padding-right: 0;
        padding-bottom: 12px;
    }
    .profile-field-wide {
        grid-column: auto;
    }
    .profile-basic-address {
        grid-column: auto;
    }
    .profile-edit-address,
    .profile-edit-wide {
        grid-column: auto;
    }
    .profile-edit-submit-body {
        align-items: stretch;
        flex-direction: column;
    }
    .profile-document-row {
        grid-template-columns: 24px minmax(0, 1fr);
    }
    .profile-document-row strong {
        grid-column: 2;
    }
}

@media (max-width: 575px) {
    .admin-summary-six-grid .compact-summary-card {
        min-height: auto;
        padding: 18px;
    }
    .admin-summary-six-grid .compact-summary-head {
        gap: 12px;
    }
    .admin-summary-six-grid .compact-summary-icon {
        border-radius: 15px;
        font-size: 19px;
        height: 48px;
        min-width: 48px;
        width: 48px;
    }
    .admin-summary-six-grid .compact-count-row {
        grid-template-columns: 1fr;
    }
    .admin-pinned-grid {
        grid-template-columns: 1fr;
    }
    .admin-pinned-card {
        min-height: auto;
        padding: 16px;
    }
    .admin-pinned-member {
        grid-template-columns: auto minmax(0, 1fr);
    }
    .admin-pinned-count {
        grid-column: 1 / -1;
        justify-self: start;
    }
    .admin-pinned-mini-stats {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .admin-pinned-project {
        align-items: flex-start;
        grid-template-columns: auto minmax(0, 1fr);
    }
    .admin-pinned-project em {
        grid-column: 2;
        justify-self: start;
    }
    .suggestion-hero,
    .suggestion-summary-shell,
    .suggestion-celebration-strip {
        padding: 18px;
    }
    .ideas-page-header {
        align-items: stretch;
        flex-direction: column;
    }
    .ideas-page-title {
        align-items: flex-start;
    }
    .ideas-title-icon {
        flex-basis: 54px;
        font-size: 28px;
        height: 54px;
    }
    .ideas-page-title h2 {
        font-size: 28px;
    }
    .ideas-new-button {
        width: 100%;
    }
    .ideas-kpi-card {
        min-height: 104px;
    }
    .ideas-approved-marquee {
        padding: 16px 0;
    }
    .ideas-approved-marquee-head {
        align-items: flex-start;
        margin: 0 16px 14px;
    }
    .ideas-approved-marquee-track {
        gap: 10px;
        padding: 0 16px;
    }
    .ideas-approved-marquee-card {
        width: 280px;
    }
    .ideas-section-head {
        padding: 17px 16px;
    }
    .admin-ideas-page-header {
        padding: 16px;
    }
    .admin-idea-card-main {
        grid-template-columns: 44px minmax(0, 1fr);
    }
    .admin-idea-title-line {
        flex-direction: column;
    }
    .ideas-list {
        padding: 0 10px 10px;
    }
    .ideas-row {
        gap: 12px;
        grid-template-columns: 44px minmax(0, 1fr);
        padding: 15px 4px;
    }
    .admin-idea-card-approved-flat {
        grid-template-columns: 1fr;
    }
    .ideas-row-icon {
        border-radius: 12px;
        font-size: 20px;
        height: 44px;
        width: 44px;
    }
    .ideas-row-status,
    .ideas-row-feedback,
    .ideas-row-details {
        grid-column: 1 / -1;
    }
    .ideas-note {
        align-items: flex-start;
        text-align: left;
    }
    .suggestion-hero-points {
        grid-template-columns: 1fr;
    }
    .suggestion-hero-copy h2 {
        font-size: 22px;
    }
    .suggestion-hero-actions .btn {
        width: 100%;
    }
    .login-panel {
        padding: 28px 18px 34px;
    }
    .login-panel .talent-brand {
        margin-bottom: 34px;
    }
    .login-visual {
        min-height: 320px;
        padding: 34px 20px;
    }
    .profile-document-card-grid {
        grid-template-columns: 1fr;
    }
    .login-hero-copy h2 {
        font-size: 36px;
        white-space: normal;
    }
    .login-motivation {
        font-size: 17px;
    }
}

/* Team dashboard greeting and role KPI strip */
.team-hero-with-kpis {
    align-items: stretch;
    border-radius: 22px;
    gap: 0;
    padding: 28px 32px;
}

.team-hero-with-kpis .team-hero-profile {
    flex: 0 0 38%;
    min-width: 0;
    padding-right: 28px;
}

.team-hero-with-kpis .team-hero-profile .avatar-xl {
    border-radius: 22px;
    height: 86px;
    width: 86px;
}

.team-hero-with-kpis .team-hero-profile .eyebrow {
    color: #6b7280;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.team-hero-with-kpis h2 {
    color: #181876;
    font-size: clamp(28px, 2.4vw, 38px);
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.12;
}

.team-hero-with-kpis .team-hero-profile p:last-child {
    color: #6b7280;
    font-size: 18px;
    line-height: 1.35;
}

.team-hero-kpis {
    display: grid;
    flex: 1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-width: 0;
}

.team-hero-kpi {
    align-items: center;
    border-left: 1px solid #e5e7eb;
    display: flex;
    gap: 18px;
    min-width: 0;
    padding: 8px 26px;
}

.team-hero-kpi-icon {
    align-items: center;
    border-radius: 22px;
    display: inline-flex;
    flex: 0 0 76px;
    font-size: 34px;
    height: 76px;
    justify-content: center;
    width: 76px;
}

.team-hero-kpi-icon-orange {
    background: #fff1e8;
    color: #f97316;
}

.team-hero-kpi-icon-green {
    background: #eafaf1;
    color: #16a34a;
}

.team-hero-kpi-icon-blue {
    background: #eef5ff;
    color: #085bcb;
}

.team-hero-kpi small {
    color: #181876;
    display: block;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25;
}

.team-hero-kpi strong {
    color: #085bcb;
    display: block;
    font-size: 36px;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1;
    margin-top: 10px;
}

.team-hero-kpi:nth-child(1) strong {
    color: #f97316;
}

.team-hero-kpi:nth-child(2) strong {
    color: #16a34a;
}

.team-hero-kpi:nth-child(3) strong {
    color: #085bcb;
}

.team-hero-kpi-unit {
    color: inherit;
    font-size: .5em;
}

.team-hero-kpi-unit-prefix {
    margin-right: 6px;
}

.team-hero-kpi-unit-suffix {
    margin-left: 3px;
}

@media (max-width: 1199px) {
    .team-hero-with-kpis {
        flex-direction: column;
    }

    .team-hero-with-kpis .team-hero-profile {
        flex-basis: auto;
        padding-right: 0;
    }

    .team-hero-kpis {
        border-top: 1px solid #e5e7eb;
        margin-top: 22px;
        padding-top: 18px;
    }

    .team-hero-kpi:first-child {
        border-left: 0;
        padding-left: 0;
    }
}

@media (max-width: 767px) {
    .team-hero-with-kpis {
        padding: 22px;
    }

    .team-hero-with-kpis .team-hero-profile {
        align-items: flex-start;
        flex-direction: column;
    }

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

    .team-hero-kpi {
        border-left: 0;
        border-top: 1px solid #e5e7eb;
        padding: 16px 0 0;
    }

    .team-hero-kpi:first-child {
        border-top: 0;
        padding-top: 0;
    }

    .team-hero-kpi-icon {
        border-radius: 18px;
        flex-basis: 58px;
        font-size: 26px;
        height: 58px;
        width: 58px;
    }

    .team-hero-kpi strong {
        font-size: 30px;
    }
}