/* Assessment workspace. Scoped to authenticated application pages. */
body.vf-workspace {
    --sidebar-width: 248px;
    --sidebar-gap: 1rem;
    --workspace-ink: #202938;
    --workspace-muted: #788292;
    --workspace-border: #e8ebf0;
    background: var(--vf-workspace-bg, #0c1629) !important;
    color: var(--workspace-ink);
    font-family: 'Plus Jakarta Sans', 'Open Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
}
body.vf-app.vf-workspace {
    background-color: var(--vf-workspace-bg, #0c1629) !important;
    background-image:
        radial-gradient(circle at 18% 30%, color-mix(in srgb, var(--vf-primary, #d92028) 24%, transparent), transparent 27%),
        radial-gradient(circle at 88% 74%, color-mix(in srgb, var(--vf-primary, #d92028) 17%, transparent), transparent 25%),
        linear-gradient(rgba(255, 255, 255, .028) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .028) 1px, transparent 1px) !important;
    background-size: auto, auto, 48px 48px, 48px 48px !important;
    background-attachment: fixed !important;
}
body.vf-workspace .vf-header-banner { display: none; }
body.vf-workspace .main-content {
    min-width: 0;
    min-height: 100vh;
    padding-right: 0 !important;
    background: transparent !important;
    animation: vfWorkspaceEnter .45s ease-out;
}
body.vf-app.vf-workspace .vf-page-heading h1,
body.vf-app.vf-workspace .vf-dashboard-heading h1 { color: #f7f9fc; }
body.vf-app.vf-workspace .vf-page-description,
body.vf-app.vf-workspace .vf-dashboard-heading p:not(.vf-eyebrow) { color: #a8b4c8; }
body.vf-app.vf-workspace .vf-page-eyebrow,
body.vf-app.vf-workspace .vf-dashboard .vf-eyebrow { color: color-mix(in srgb, var(--vf-primary, #d92028) 60%, white); }
body.vf-app.vf-workspace .vf-page-heading-symbol {
    color: color-mix(in srgb, var(--vf-primary, #d92028) 65%, white);
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .16);
    box-shadow: 0 10px 28px rgba(2, 8, 20, .2);
}
body.vf-app.vf-workspace .vf-scope-badge {
    color: #d8dfeb;
    background: rgba(255, 255, 255, .08);
    border-color: rgba(255, 255, 255, .15);
}
body.vf-app.vf-workspace .vf-scope-badge i { color: color-mix(in srgb, var(--vf-primary, #d92028) 60%, white); }
body.vf-app.vf-workspace .vf-dashboard-footer,
body.vf-app.vf-workspace .footer .copyright,
body.vf-app.vf-workspace .footer .nav-link { color: #a8b4c8 !important; }
@keyframes vfWorkspaceEnter {
    from { opacity: 0; }
    to { opacity: 1; }
}
@media (min-width: 1200px) {
    body.vf-workspace .main-content { margin-left: 280px !important; width: calc(100% - 280px); }
}
@media (max-width: 1199.98px) {
    body.vf-workspace .main-content { margin-left: 0 !important; width: 100%; padding-left: 0 !important; }
}

@media (prefers-reduced-motion: reduce) {
    body.vf-workspace .main-content { animation: none !important; }
}

.vf-dashboard { max-width: 1640px; margin: 0 auto; padding: 8px 28px 0 12px; }
.vf-dashboard h1, .vf-dashboard h2, .vf-dashboard h3, .vf-dashboard p { margin: 0; }
.vf-dashboard h1, .vf-dashboard h2, .vf-dashboard h3 { color: var(--workspace-ink); font-family: inherit; }
.vf-dashboard-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 14px 0 26px; }
.vf-dashboard .vf-eyebrow { margin-bottom: 7px; color: #9a4650; font-size: 10px; font-weight: 800; letter-spacing: .16em; }
.vf-dashboard-heading h1 { font-size: clamp(23px, 2.3vw, 32px); font-weight: 800; letter-spacing: -1.15px; line-height: 1.25; }
.vf-dashboard-heading p:not(.vf-eyebrow) { margin-top: 9px; color: #697587; font-size: 13px; line-height: 1.6; }
.vf-scope-badge { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; padding: 10px 13px; border: 1px solid #e2e6ee; background: #fff; border-radius: 8px; color: #677285; font-size: 11px; font-weight: 600; }
.vf-scope-badge i { color: #939dac; }

.vf-welcome { margin-bottom: 22px; position: relative; isolation: isolate; display: flex; align-items: center; justify-content: space-between; gap: 32px; min-height: 248px; padding: 32px 36px; overflow: hidden; border-radius: 18px; background: linear-gradient(110deg, var(--vf-primary-dark, #b71c1c) 0%, var(--vf-primary, #d92028) 64%, color-mix(in srgb, var(--vf-primary, #d92028) 82%, white) 100%); box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--vf-primary-dark, #b71c1c) 40%, transparent); }
.vf-welcome::before, .vf-welcome::after { content: ''; position: absolute; z-index: -1; width: 390px; height: 390px; border: 1px solid #ffffff13; border-radius: 50%; right: -75px; top: -135px; pointer-events: none; }
.vf-welcome::after { width: 510px; height: 510px; top: -195px; right: -135px; box-shadow: 0 0 0 60px #ffffff04, 0 0 0 120px #ffffff03; }
.vf-welcome-copy { min-width: 0; flex: 1; }
.vf-welcome-label { display: flex; align-items: center; gap: 7px; color: #ffe1e3; font-size: 9px; letter-spacing: .17em; font-weight: 700; }
.vf-welcome-label > span { width: 5px; height: 5px; background: #ffbfb4; border-radius: 50%; }
.vf-welcome h2 { margin: 15px 0 10px; max-width: 640px; color: #fff; font-size: clamp(24px, 2.1vw, 34px); font-weight: 700; letter-spacing: -1px; line-height: 1.3; overflow-wrap: anywhere; }
.vf-welcome-dot { color: #ffc5ab; }
.vf-welcome p { color: #ffe2e4; font-size: 13px; line-height: 1.85; }
.vf-welcome-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 22px; }
.vf-dashboard-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 40px; padding: 11px 16px; border: 1px solid transparent; border-radius: 7px; font-size: 11px; font-weight: 800; transition: transform .2s, box-shadow .2s; }
.vf-button-white { background: #fff; color: #ae2332; box-shadow: 0 4px 12px #750d1b18; }
.vf-button-white:hover { color: #8e1725; transform: translateY(-2px); box-shadow: 0 6px 16px #750d1b30; }
.vf-dashboard-button > i:last-child { margin-left: 6px; }
.vf-welcome-link { display: inline-flex; align-items: center; gap: 9px; min-height: 40px; color: #fff; font-size: 11px; font-weight: 600; }
.vf-welcome-link:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.vf-welcome-link i { font-size: 9px; }
.vf-library-preview { flex: 0 0 290px; position: relative; border: 1px solid #ffffff35; background: #ffffff10; padding: 22px; border-radius: 15px; box-shadow: 0 15px 35px #780d2010; }
.vf-library-heading { display: flex; align-items: center; gap: 9px; color: #ffe5e7; font-size: 8px; font-weight: 700; letter-spacing: .08em; }
.vf-library-heading > i { margin-left: auto; color: #ffcdc0; font-size: 9px; }
.vf-library-icon { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 8px; background: #ffffff1a; font-size: 12px; color: #fff; }
.vf-library-preview > strong { display: block; margin: 15px 0 19px; color: #fff; font-size: 42px; font-weight: 700; letter-spacing: -1.7px; line-height: 1.15; }
.vf-library-preview > strong > span { display: block; margin-top: 5px; font-size: 11px; color: #ffdde1; font-weight: 500; letter-spacing: 0; }
.vf-library-footer { display: flex; flex-wrap: wrap; gap: 8px 12px; justify-content: space-between; padding-top: 14px; border-top: 1px solid #ffffff26; color: #ffe7e8; font-size: 9px; }
.vf-library-footer i { margin-right: 4px; }

.vf-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 22px 0; }
.vf-metric { padding: 20px 20px 17px; background: #fff; border: 1px solid var(--workspace-border); border-radius: 13px; box-shadow: 0 3px 5px #192b4602; }
.vf-metric-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: #687486; font-size: 12px; font-weight: 600; }
.vf-metric-icon { display: inline-flex; align-items: center; justify-content: center; width: 33px; height: 33px; border-radius: 9px; font-size: 13px; flex-shrink: 0; }
.vf-tone-red { color: #cb4055; background: #fff0f1; }
.vf-tone-blue { color: #597ad0; background: #edf2ff; }
.vf-tone-green { color: #239b80; background: #eaf7f3; }
.vf-tone-amber { color: #bc8930; background: #fff7e8; }
.vf-metric-value { display: block; margin: 7px 0 18px; color: #252d3c; font-size: 32px; line-height: 1.2; font-weight: 800; letter-spacing: -1.1px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.vf-metric-value small { font-size: 20px; font-weight: 600; margin-left: 2px; }
.vf-metric-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; color: #737d8d; font-size: 10px; line-height: 1.5; }
.vf-metric-change { display: inline-flex; align-items: center; gap: 3px; padding: 3px 5px; border-radius: 4px; background: #edf8f2; color: #21825d; font-size: 9px; font-weight: 700; }
.vf-metric-change i { font-size: 7px; }
.vf-metric-change.vf-change-down { background: #fff0f1; color: #b92b3c; }
.vf-metric-change.vf-change-pending { background: #fff6e6; color: #986818; }

.vf-analytics-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 20px; align-items: stretch; }
.vf-panel { min-width: 0; padding: 24px; background: #fff; border: 1px solid var(--workspace-border); border-radius: 14px; }
.vf-panel-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.vf-panel-heading h2 { font-size: 15px; font-weight: 800; letter-spacing: -.25px; line-height: 1.5; }
.vf-panel-heading p { margin-top: 4px; color: #737d8d; font-size: 11px; line-height: 1.6; }
.vf-count-badge { padding: 4px 8px; border: 1px solid #e9edf3; background: #f9fafc; border-radius: 5px; font-size: 10px; color: #6f7a8b; font-weight: 600; white-space: nowrap; }
.vf-panel-heading-icon { color: #a3acb9; font-size: 14px; padding-top: 3px; }
.vf-department-chart { display: flex; flex-direction: column; gap: 21px; height: 235px; overflow-y: auto; padding: 4px 7px 4px 0; margin: 25px -7px 20px 0; scrollbar-width: thin; scrollbar-color: #d9dde6 transparent; }
.vf-department-row { flex-shrink: 0; }
.vf-department-label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 9px; color: #536074; font-size: 12px; }
.vf-department-label > span { overflow-wrap: anywhere; }
.vf-department-label strong { flex-shrink: 0; font-size: 12px; font-weight: 700; color: #374255; font-variant-numeric: tabular-nums; }
.vf-department-label small { display: inline-block; min-width: 31px; margin-left: 9px; color: #737d8d; font-size: 10px; font-weight: 500; text-align: right; }
.vf-department-track { height: 8px; border-radius: 3px; background: #f3f4f8; overflow: hidden; }
.vf-department-track > span { display: block; min-width: 3px; height: 100%; border-radius: inherit; background: #d74254; }
.vf-department-row:nth-child(3n+2) .vf-department-track > span { background: #e57480; }
.vf-department-row:nth-child(3n+3) .vf-department-track > span { background: #eaa1a9; }
.vf-panel-footnote { display: flex; align-items: center; gap: 6px; padding-top: 14px; border-top: 1px solid #f0f2f6; color: #737d8d; font-size: 10px; }
.vf-chart-key { width: 6px; height: 6px; background: #d74254; border-radius: 2px; }
.vf-footnote-end { margin-left: auto; }
.vf-difficulty-content { display: flex; align-items: center; justify-content: center; gap: 25px; min-height: 237px; padding: 23px 0; }
.vf-difficulty-ring { flex: 0 0 162px; width: 162px; height: 162px; padding: 17px; border-radius: 50%; transform: rotate(-.01deg); }
.vf-difficulty-ring > div { display: flex; align-items: center; justify-content: center; flex-direction: column; width: 100%; height: 100%; border-radius: 50%; background: #fff; box-shadow: 0 0 0 5px #fff; }
.vf-difficulty-ring strong { color: #293447; font-size: 30px; font-weight: 800; letter-spacing: -.9px; }
.vf-difficulty-ring span { margin-top: 1px; color: #737d8d; font-size: 10px; }
.vf-difficulty-legend { min-width: 135px; flex: 1; padding: 0; margin: 0; list-style: none; }
.vf-difficulty-legend li { display: flex; align-items: center; gap: 7px; padding: 12px 0; color: #6b778a; font-size: 11px; }
.vf-legend-dot { width: 7px; height: 7px; flex-shrink: 0; border-radius: 50%; }
.vf-level-easy { background: #21a387; }
.vf-level-medium { background: #f0b44d; }
.vf-level-hard { background: #e15a68; }
.vf-level-other { background: #a8b2c3; }
.vf-difficulty-legend strong { margin-left: auto; color: #364256; font-size: 12px; font-variant-numeric: tabular-nums; }
.vf-difficulty-legend small { min-width: 25px; color: #737d8d; font-size: 10px; text-align: right; }
.vf-mandatory-note { display: flex; align-items: center; gap: 12px; padding: 14px; background: #f7f8fb; border: 1px solid #eff1f5; border-radius: 9px; }
.vf-mandatory-icon { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: #fff; border: 1px solid #eceef4; border-radius: 8px; color: #8674ba; font-size: 13px; flex-shrink: 0; }
.vf-mandatory-note strong { display: block; color: #5b6577; font-size: 11px; font-weight: 700; }
.vf-mandatory-note p { margin-top: 4px; color: #737d8d; font-size: 10px; }
.vf-no-difficulty { padding-bottom: 15px; color: #697587; font-size: 10px; text-align: center; }
.vf-empty-state { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 290px; text-align: center; padding: 25px; }
.vf-empty-icon { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; margin-bottom: 18px; background: #fff1f2; color: #c94c5c; border-radius: 15px; font-size: 21px; }
.vf-empty-state h3 { font-size: 15px; font-weight: 700; }
.vf-empty-state p { margin: 10px 0; color: #818b9b; font-size: 11px; line-height: 1.7; }
.vf-text-link { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; color: #bc3348; font-size: 11px; font-weight: 700; }

.vf-quick-access { margin-top: 28px; }
.vf-section-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.vf-section-heading h2 { color: #fff; font-size: 15px; font-weight: 800; letter-spacing: -.15px; }
.vf-section-heading > span { color: #d8dfeb; font-size: 11px; }
.vf-shortcut-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.vf-shortcut { display: flex; align-items: center; gap: 11px; padding: 18px 14px; background: rgba(255, 255, 255, .09); border: 1px solid rgba(255, 255, 255, .15); border-radius: 11px; box-shadow: 0 10px 28px rgba(2, 8, 20, .12); transition: background-color .2s, border-color .2s, box-shadow .2s, transform .2s; }
.vf-shortcut:hover { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .3); box-shadow: 0 14px 32px rgba(2, 8, 20, .2); transform: translateY(-3px); }
.vf-shortcut-icon { display: flex; align-items: center; justify-content: center; width: 33px; height: 36px; flex-shrink: 0; border-radius: 9px; font-size: 13px; }
.vf-shortcut-copy { min-width: 0; }
.vf-shortcut-copy strong { display: block; color: #fff; font-size: 12px; font-weight: 700; line-height: 1.5; }
.vf-shortcut-copy > span { display: block; color: #d8dfeb; font-size: 10px; line-height: 1.6; margin-top: 4px; }
.vf-shortcut-arrow { color: #d8dfeb; font-size: 8px; margin-left: auto; }
.vf-dashboard-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 25px 0 20px; margin-top: 14px; color: #737d8d; font-size: 10px; line-height: 1.6; }
.vf-dashboard-footer > span:last-child > span { margin: 0 6px; }
.vf-dashboard a:focus-visible, .vf-dashboard [tabindex]:focus-visible { outline: 3px solid #597ad0; outline-offset: 5px; border-radius: 5px; }
.vf-welcome a:focus-visible { outline-color: #fff; }

@media (min-width: 1600px) {
    .vf-dashboard { padding-top: 14px; }
    .vf-welcome { padding: 38px 42px; }
    .vf-metric { padding: 24px; }
    .vf-metric-value { font-size: 38px; }
    .vf-library-preview { flex-basis: 330px; }
    .vf-difficulty-content { gap: 40px; }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
    .vf-difficulty-content { gap: 16px; }
    .vf-difficulty-ring { flex-basis: 125px; width: 125px; height: 125px; padding: 14px; }
    .vf-panel { padding: 20px; }
    .vf-shortcut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .vf-metric { padding: 16px; }
}
@media (max-width: 1199.98px) {
    .vf-dashboard { padding: 8px 24px 0; }
}
@media (max-width: 991.98px) {
    .vf-library-preview { flex-basis: 240px; padding: 18px; }
    .vf-library-heading { font-size: 6px; }
    .vf-welcome { padding: 28px; gap: 24px; }
    .vf-metric { padding: 15px; }
    .vf-metric-heading { font-size: 11px; }
    .vf-metric-icon { width: 28px; height: 28px; font-size: 11px; }
    .vf-analytics-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 16px; }
    .vf-panel { padding: 20px; }
    .vf-difficulty-content { flex-direction: column; gap: 14px; padding: 24px 0 16px; }
    .vf-difficulty-ring { flex-basis: auto; width: 140px; height: 140px; padding: 15px; }
    .vf-difficulty-legend { width: 100%; }
    .vf-difficulty-legend li { padding: 7px 0; }
    .vf-department-chart { height: 310px; }
    .vf-shortcut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
    .vf-dashboard-heading { margin-top: 10px; }
    .vf-scope-badge { font-size: 8px; padding: 8px 10px; }
    .vf-welcome { padding: 28px; }
    .vf-library-preview { display: none; }
    .vf-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
    .vf-metric { padding: 18px; }
    .vf-metric-heading { font-size: 11px; }
    .vf-metric-icon { width: 33px; height: 33px; font-size: 13px; }
    .vf-metric-value { font-size: 32px; }
    .vf-metric-footer { font-size: 9px; }
    .vf-analytics-grid { grid-template-columns: minmax(0, 1fr); }
    .vf-panel-heading h2 { font-size: 14px; }
    .vf-department-chart { height: auto; max-height: 320px; }
    .vf-difficulty-content { flex-direction: row; justify-content: space-around; gap: 30px; min-height: 218px; }
    .vf-difficulty-legend { max-width: 220px; width: auto; }
    .vf-difficulty-legend li { padding: 11px 0; }
    .vf-shortcut { min-height: 88px; }
    .vf-dashboard-footer { font-size: 9px; }
}
@media (max-width: 575.98px) {
    .vf-dashboard { padding: 4px 16px 0; }
    .vf-dashboard-heading { align-items: flex-start; flex-direction: column; gap: 12px; margin-bottom: 18px; }
    .vf-dashboard-heading h1 { font-size: 26px; }
    .vf-dashboard-heading p:not(.vf-eyebrow) { font-size: 11px; }
    .vf-scope-badge { padding: 7px 9px; font-size: 9px; }
    .vf-welcome { padding: 25px 22px; border-radius: 13px; min-height: 235px; }
    .vf-welcome h2 { font-size: 27px; }
    .vf-welcome p { font-size: 12px; }
    .vf-welcome-label { font-size: 7px; }
    .vf-welcome-actions { gap: 15px; }
    .vf-dashboard-button { min-height: 44px; padding: 10px 12px; }
    .vf-welcome-link { min-height: 44px; }
    .vf-metric { padding: 14px; }
    .vf-metric-heading { font-size: 11px; }
    .vf-metric-value { margin-top: 10px; font-size: 30px; }
    .vf-metric-footer { font-size: 10px; }
    .vf-metric-icon { width: 28px; height: 28px; font-size: 11px; }
    .vf-panel { padding: 20px; }
    .vf-panel-heading h2 { font-size: 14px; }
    .vf-difficulty-content { gap: 22px; }
    .vf-difficulty-ring { width: 125px; height: 125px; padding: 13px; }
    .vf-difficulty-legend { min-width: 118px; }
    .vf-difficulty-legend li { font-size: 11px; gap: 5px; }
    .vf-difficulty-ring strong { font-size: 27px; }
    .vf-section-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
    .vf-shortcut-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .vf-shortcut { padding: 15px; min-height: 76px; }
    .vf-shortcut-copy strong { font-size: 12px; }
    .vf-shortcut-copy > span { font-size: 10px; }
    .vf-shortcut-arrow { font-size: 10px; }
}
@media (max-width: 359.98px) {
    .vf-metric-heading { flex-direction: column-reverse; align-items: flex-start; }
    .vf-difficulty-content { flex-direction: column; }
    .vf-difficulty-legend { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
    .vf-dashboard *, .vf-dashboard *::before, .vf-dashboard *::after { animation: none !important; transition: none !important; }
}