/* VCEdump Test Engine brand layer. Shared structure and behavior live in test-engine.min.css.
   The shared engine layout does not load /themes/vcedump/css/vcedump.css, so the design-system
   tokens this layer needs are mirrored here verbatim from that stylesheet's §1 TOKENS. */
:root {
    /* colour - green ramp */
    --vd-green-50: #e9f7ef;
    --vd-green-500: #00a651;
    --vd-green-600: #00803e;
    --vd-green-700: #00632f;

    --vd-green-100: #cbeddd;
    --vd-green-200: #97dbbb;
    --vd-green-800: #004821;

    /* colour - neutral ramp */
    --vd-n-0: #ffffff;
    --vd-n-25: #fafbfa;
    --vd-n-50: #f4f6f4;
    --vd-n-100: #eceeec;
    --vd-n-200: #dde1de;
    --vd-n-300: #c4cac6;
    --vd-n-400: #9aa29d;
    --vd-n-500: #737b76;
    --vd-n-600: #565d58;
    --vd-n-700: #3d443f;
    --vd-n-900: #111614;

    /* colour - status */
    --vd-success: #0b6e6a;
    --vd-success-bg: #e6f4f3;
    --vd-error: #b3261e;
    --vd-error-bg: #fdeceb;
    --vd-warning: #9a5b00;
    --vd-warning-bg: #fdf1de;

    /* role - surface, border, text */
    --vd-surface-page: var(--vd-n-50);
    --vd-surface-card: var(--vd-n-0);
    --vd-surface-sunken: var(--vd-n-25);
    --vd-border-divider: var(--vd-n-200);
    --vd-border-field: var(--vd-n-300);
    --vd-border-field-hover: var(--vd-n-400);
    --vd-text-heading: var(--vd-n-900);
    --vd-text-body: var(--vd-n-700);
    --vd-text-secondary: var(--vd-n-600);
    --vd-text-muted: var(--vd-n-500);
    --vd-text-on-brand: var(--vd-n-0);

    /* type */
    --vd-font-ui: Ubuntu, system-ui, -apple-system, "Segoe UI", sans-serif;
    --vd-font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
    --vd-body-size: 15px;
    --vd-body-line: 24px;
    --vd-body-lg-size: 17px;
    --vd-body-lg-line: 27px;
    --vd-body-sm-size: 13px;
    --vd-label-size: 13px;
    --vd-code-size: 14px;
    --vd-code-line: 20px;
    --vd-overline-size: 11px;
    --vd-overline-line: 16px;
    --vd-overline-track: 0.12em;
    --vd-reading-max: 760px;

    /* radius */
    --vd-radius-sm: 7px;
    --vd-radius-md: 10px;
    --vd-radius-lg: 14px;
    --vd-radius-pill: 999px;

    /* spacing - 4px base */
    --vd-space-1: 4px;
    --vd-space-2: 8px;
    --vd-space-3: 12px;
    --vd-space-4: 16px;
    --vd-space-5: 20px;
    --vd-space-6: 24px;
    --vd-space-16: 64px;
    --vd-gutter-mobile: 16px;

    /* size & rings */
    --vd-border-hairline: 1px;
    --vd-border-strong: 1.5px;
    --vd-border-accent: 2px;
    --vd-alert-rail: 4px;
    --vd-control-md: 40px;
    --vd-touch-min: 44px;
    --vd-header-h: 64px;
    --vd-qmap-cell: 32px;
    --vd-quota-meter-h: 6px;
    --vd-focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px #00632f;
}

.te-site--vcedump {
    --te-brand-icon: url("/themes/vcedump/img/brand/favicon.svg");
    --pk-blue: var(--vd-green-700);
    --pk-blue-dark: var(--vd-green-700);
    --te-primary: var(--vd-green-700);
    --te-primary-dark: var(--vd-green-700);
    --te-accent: var(--vd-green-600);
    --pk-radius: var(--vd-radius-md);
    background: var(--vd-surface-page);
    color: var(--vd-text-body);
    font-family: var(--vd-font-ui);
}

.te-site--vcedump .te-workspace-header,
.te-site--vcedump .te-library-header {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.te-site--vcedump .pk-q-card,
.te-site--vcedump .pk-side-card,
.te-site--vcedump .te-library-record,
.te-site--vcedump .te-practice-hero,
.te-site--vcedump .te-practice-metrics,
.te-site--vcedump .pk-exam-history-row,
.te-site--vcedump .te-result-hero,
.te-site--vcedump .te-result-tiles > div {
    border-radius: var(--vd-radius-lg) !important;
}

.te-site--vcedump .pk-btn,
.te-site--vcedump .pk-q-flag,
.te-site--vcedump .te-library-account-link,
.te-site--vcedump .te-practice-help {
    border-radius: var(--vd-radius-md) !important;
}

.te-site--vcedump .pk-q-type,
.te-site--vcedump .pk-practice-empty-status {
    color: var(--vd-green-700);
}

/* My Exams remains on the shared engine surface, with a VCEdump-only account
   presentation. No entitlement, routing, progress or practice behavior lives
   in this layer. */
.te-site--vcedump .te-library-shell {
    background: var(--vd-surface-page) !important;
    color: var(--vd-text-body) !important;
    font-family: var(--vd-font-ui) !important;
}

.te-site--vcedump .te-library-header {
    height: 68px !important;
    padding-inline: max(28px, calc((100vw - 1180px) / 2)) !important;
    border-bottom: 0 !important;
    background: var(--vd-green-800) !important;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .08);
}

.te-site--vcedump .te-library-header .te-brand {
    gap: var(--vd-space-2);
    color: var(--vd-n-0);
}

.te-site--vcedump .te-library-header .te-brand__image,
.te-site--vcedump .te-library-header .te-brand__site-icon,
.te-site--vcedump .te-library-header .te-brand__name {
    display: none;
}

.te-site--vcedump .te-library-header .te-brand::before {
    width: 32px;
    height: 32px;
    flex: none;
    background: url("/themes/vcedump/img/brand/logo-mark.svg") center / contain no-repeat;
    content: "";
}

.te-site--vcedump .te-library-header .te-brand::after {
    color: var(--vd-n-0);
    content: "VCEdump";
    font-size: 21px;
    font-weight: 700;
    letter-spacing: -.02em;
}

.te-site--vcedump .te-library-account-link {
    min-height: var(--vd-touch-min);
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    padding: var(--vd-space-2) var(--vd-space-4) !important;
    border: var(--vd-border-hairline) solid rgba(255, 255, 255, .28);
    background: rgba(255, 255, 255, .08) !important;
    color: var(--vd-n-0) !important;
    font-family: inherit;
    font-size: var(--vd-body-sm-size) !important;
    font-weight: 600 !important;
}

.te-site--vcedump .te-library-account-link:hover {
    border-color: rgba(255, 255, 255, .48);
    background: rgba(255, 255, 255, .14) !important;
}

.te-site--vcedump .te-library-account-link:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px var(--vd-green-800), 0 0 0 4px var(--vd-green-100);
}

.te-site--vcedump .te-library-main {
    max-width: 1040px !important;
    padding: 52px 28px 96px !important;
}

.te-site--vcedump .te-library-main > p {
    color: var(--vd-text-secondary) !important;
}

.te-site--vcedump .te-library-main > p a {
    color: var(--vd-green-700) !important;
    text-decoration: underline !important;
    text-underline-offset: 0.16em;
}

.te-site--vcedump .pk-exam-history-score > div {
    color: var(--vd-text-secondary) !important;
}

.te-site--vcedump .te-library-intro {
    max-width: 720px;
}

.te-site--vcedump .te-library-page-title {
    margin-bottom: var(--vd-space-2) !important;
    color: var(--vd-text-heading) !important;
    font-family: inherit;
    font-size: 34px !important;
    line-height: 1.15;
    font-weight: 700 !important;
}

.te-site--vcedump .te-library-page-lead {
    margin-bottom: 30px !important;
    max-width: 680px;
    color: var(--vd-text-secondary) !important;
    font-size: var(--vd-body-size) !important;
    line-height: var(--vd-body-line);
}

.te-site--vcedump .te-library-record {
    border-color: var(--vd-border-divider) !important;
    border-radius: var(--vd-radius-lg) !important;
    background: var(--vd-surface-card) !important;
    box-shadow: none !important;
}

.te-site--vcedump .te-library-record__status.is-active {
    border-color: var(--vd-green-200) !important;
    background: var(--vd-green-50) !important;
    color: var(--vd-green-700) !important;
}

.te-site--vcedump .te-library-empty {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    gap: var(--vd-space-2) var(--vd-space-6);
    align-items: center;
    padding: 34px 38px !important;
    overflow: hidden;
    border-color: var(--vd-border-divider) !important;
    border-radius: var(--vd-radius-lg) !important;
    background: var(--vd-surface-card) !important;
    box-shadow: none !important;
    text-align: left !important;
}

.te-site--vcedump .te-library-empty::before {
    grid-column: 1 / -1;
    color: var(--vd-green-700);
    content: "WEB TESTENGINE";
    font-size: var(--vd-overline-size);
    line-height: var(--vd-overline-line);
    font-weight: 700;
    letter-spacing: var(--vd-overline-track);
}

.te-site--vcedump .te-library-empty::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: var(--vd-alert-rail);
    background: var(--vd-green-500);
    content: "";
}

.te-site--vcedump .te-library-empty__title {
    grid-column: 1;
    margin: 0 !important;
    color: var(--vd-text-heading) !important;
    font-size: 19px !important;
    line-height: 1.3;
    font-weight: 700 !important;
}

.te-site--vcedump .te-library-empty__copy {
    grid-column: 1;
    margin: 0 !important;
    max-width: 560px !important;
    color: var(--vd-text-secondary) !important;
    font-size: var(--vd-body-size) !important;
    line-height: var(--vd-body-line) !important;
}

.te-site--vcedump .te-library-empty__action {
    grid-column: 2;
    grid-row: 2 / span 2;
    min-height: var(--vd-touch-min);
    box-sizing: border-box;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: var(--vd-space-2) var(--vd-space-5) !important;
    border: var(--vd-border-hairline) solid var(--vd-green-600);
    border-radius: var(--vd-radius-md) !important;
    background: var(--vd-green-600) !important;
    color: var(--vd-text-on-brand) !important;
    font-family: inherit;
    font-size: var(--vd-body-size) !important;
    font-weight: 600 !important;
}

.te-site--vcedump .te-library-empty__action:hover {
    border-color: var(--vd-green-700);
    background: var(--vd-green-700) !important;
}

.te-site--vcedump .te-library-empty__action:focus-visible {
    outline: none;
    box-shadow: var(--vd-focus-ring);
}

.te-site--vcedump .pk-player-sku {
    flex: none;
    white-space: nowrap;
}

.te-site--vcedump .pk-player-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.te-site--vcedump .pk-qmap a.is-reviewed,
.te-site--vcedump .pk-qmap span.is-reviewed {
    border-color: var(--vd-border-field);
    background: var(--vd-surface-sunken);
    color: var(--vd-text-secondary);
}

.te-site--vcedump .pk-qmap-legend b {
    color: var(--vd-text-heading);
    font-weight: 500;
}

.te-site--vcedump .te-result-pagination {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr) max-content;
    align-items: center;
    gap: var(--vd-space-3);
    margin-top: var(--vd-space-5);
}

.te-site--vcedump .te-result-pagination > span {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--vd-space-2);
}

.te-site--vcedump .te-result-pagination button {
    min-width: 44px;
    min-height: 44px;
    padding: var(--vd-space-2) var(--vd-space-3);
    border: var(--vd-border-hairline) solid var(--vd-border-divider);
    border-radius: var(--vd-radius-sm);
    background: var(--vd-surface-card);
    color: var(--vd-text-body);
    cursor: pointer;
    font-family: inherit;
    font-size: var(--vd-body-size);
    font-weight: 500;
}

.te-site--vcedump .te-result-pagination button:hover,
.te-site--vcedump .te-result-pagination button:focus-visible,
.te-site--vcedump .te-result-pagination button[aria-current="page"] {
    border-color: var(--vd-green-600);
    background: var(--vd-green-50);
    color: var(--vd-green-700);
}

.te-site--vcedump .te-result-pagination button:focus-visible {
    outline: none;
    box-shadow: var(--vd-focus-ring);
}

.te-site--vcedump .te-result-pagination button:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.te-site--vcedump .pk-q-nav > span.pk-btn {
    opacity: 1 !important;
    border-color: var(--vd-border-divider);
    background: var(--vd-n-100);
    color: var(--vd-text-secondary);
}

.te-site--vcedump .te-result-pagination small {
    grid-column: 1 / -1;
    color: var(--vd-text-secondary);
    text-align: center;
}

@media (max-width: 560px) {
    .te-site--vcedump .te-result-pagination {
        grid-template-columns: 1fr 1fr;
    }

    .te-site--vcedump .te-result-pagination > span {
        grid-column: 1 / -1;
        grid-row: 1;
    }
}

@media (max-width: 760px) {
    .te-site--vcedump .pk-player-head {
        min-height: 60px;
        height: auto;
        padding: var(--vd-space-2) var(--vd-space-4);
        gap: var(--vd-space-2);
        overflow: hidden;
    }

    .te-site--vcedump .pk-player-exit,
    .te-site--vcedump .pk-exam-timer,
    .te-site--vcedump .te-brand,
    .te-site--vcedump .te-library-account-link,
    .te-site--vcedump .te-practice-help,
    .te-site--vcedump .te-result-header > a,
    .te-site--vcedump .te-custom-grid input,
    .te-site--vcedump details form > button[type="submit"] {
        min-height: 44px;
        box-sizing: border-box;
    }

    .te-site--vcedump .pk-player-name {
        flex: 1 1 auto;
    }

    .te-site--vcedump .pk-exam-badge {
        display: none;
    }

    .te-site--vcedump .pk-exam-timer {
        flex: none;
    }

    .te-site--vcedump .pk-player-main {
        width: 100%;
        max-width: 100%;
        padding: var(--vd-space-5) var(--vd-gutter-mobile) var(--vd-space-16);
        grid-template-columns: minmax(0, 1fr);
    }

    .te-site--vcedump .pk-player-main > * {
        min-width: 0;
    }

    .te-site--vcedump .pk-exam .pk-q-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--vd-space-3);
    }

    .te-site--vcedump .pk-exam .pk-q-nav > button:first-child {
        grid-column: 1 / -1;
    }

    .te-site--vcedump .pk-exam .pk-q-nav > div {
        display: none;
    }

    .te-site--vcedump .pk-exam .pk-q-nav .pk-btn {
        width: 100%;
        min-width: 0;
    }

    .te-site--vcedump .pk-qmap a,
    .te-site--vcedump .pk-qmap span {
        min-width: 44px;
        height: 44px;
    }
}

/* ─────────────────────────────────────────────────────────────────────────
   设计稿对齐层
   共享引擎的 DOM 与设计稿 engine-SAA-C03.html 是同一种布局原型（两栏 +
   粘性题号侧栏），差的是排版语言。以下把 pk-* 组件的观感对到设计系统的
   对应组件上：题干 → vd-question__*，选项 → vd-answer-option，
   标记 → vd-mark-control，题图 → vd-qmap，按钮 → vd-btn。
   全部限定在 .te-site--vcedump 之下，其余三站不受影响。
   ───────────────────────────────────────────────────────────────────────── */

/* 顶栏 → vd-engine-header */
.te-site--vcedump .pk-player-head {
    background: var(--vd-green-700);
    color: var(--vd-n-0);
    border-bottom: 0;
}
.te-site--vcedump .pk-player-exit,
.te-site--vcedump .pk-player-head a { color: var(--vd-n-0); }
.te-site--vcedump .pk-player-sku {
    font-family: var(--vd-font-mono);
    font-size: var(--vd-code-size);
    line-height: var(--vd-code-line);
    font-weight: 500;
    color: var(--vd-n-0);
}
.te-site--vcedump .pk-player-name {
    font-size: var(--vd-body-size);
    color: var(--vd-green-100);
}

/* 计时器 → vd-engine-timer */
.te-site--vcedump .pk-exam-timer {
    font-family: var(--vd-font-mono);
    font-size: var(--vd-code-size);
    font-weight: 500;
    background: rgba(255, 255, 255, 0.12);
    border: 0;
    border-radius: var(--vd-radius-sm);
    padding: 6px var(--vd-space-3);
    color: var(--vd-n-0);
}

/* 进度条 → vd-meter */
.te-site--vcedump .pk-progress-track {
    height: var(--vd-quota-meter-h);
    border-radius: var(--vd-radius-pill);
    background: var(--vd-n-200);
}
.te-site--vcedump .pk-progress-track > * {
    border-radius: var(--vd-radius-pill);
    background: var(--vd-green-500);
}

/* 题头 → vd-question__no / __type */
.te-site--vcedump .pk-q-no {
    font-family: var(--vd-font-mono);
    font-size: var(--vd-code-size);
    font-weight: 500;
    color: var(--vd-text-secondary);
}
.te-site--vcedump .pk-q-type {
    font-size: var(--vd-overline-size);
    line-height: var(--vd-overline-line);
    font-weight: 500;
    letter-spacing: var(--vd-overline-track);
    text-transform: uppercase;
    color: var(--vd-green-700);
}

/* 题干 → vd-question__stem */
.te-site--vcedump .pk-q-body {
    font-size: var(--vd-body-lg-size);
    line-height: var(--vd-body-lg-line);
    color: var(--vd-text-heading);
    max-width: var(--vd-reading-max);
}
.te-site--vcedump .pk-q-hint {
    font-size: var(--vd-body-sm-size);
    color: var(--vd-text-secondary);
}

/* 选项 → vd-answer-option（含选中/正确/错误三态）*/
.te-site--vcedump .pk-options {
    display: flex;
    flex-direction: column;
    gap: var(--vd-space-2);
    max-width: var(--vd-reading-max);
}
.te-site--vcedump .pk-opt {
    display: flex;
    align-items: flex-start;
    gap: var(--vd-space-3);
    padding: var(--vd-space-3) var(--vd-space-4);
    border: var(--vd-border-hairline) solid var(--vd-border-field);
    border-radius: var(--vd-radius-md);
    background: var(--vd-surface-card);
    font-size: var(--vd-body-size);
    line-height: var(--vd-body-line);
    color: var(--vd-text-body);
}
.te-site--vcedump .pk-opt:hover { border-color: var(--vd-border-field-hover); }
.te-site--vcedump .pk-opt.selected {
    background: var(--vd-green-50);
    border: var(--vd-border-accent) solid var(--vd-green-600);
}
.te-site--vcedump .pk-opt.correct {
    background: var(--vd-success-bg);
    border: var(--vd-border-strong) solid var(--vd-success);
    border-left-width: var(--vd-alert-rail);
}
.te-site--vcedump .pk-opt.wrong {
    background: var(--vd-error-bg);
    border: var(--vd-border-strong) solid var(--vd-error);
    border-left-width: var(--vd-alert-rail);
}
.te-site--vcedump .pk-opt.wrong .pk-opt-content { text-decoration: line-through; }
.te-site--vcedump .pk-opt-letter {
    flex: none;
    font-family: var(--vd-font-mono);
    font-size: var(--vd-code-size);
    font-weight: 500;
    color: var(--vd-text-secondary);
}
.te-site--vcedump .pk-opt.selected .pk-opt-letter { color: var(--vd-green-700); }
.te-site--vcedump .pk-opt.correct .pk-opt-letter { color: var(--vd-success); }
.te-site--vcedump .pk-opt.wrong .pk-opt-letter { color: var(--vd-error); }

/* 标记按钮 → vd-mark-control */
.te-site--vcedump .pk-q-flag {
    height: var(--vd-control-md);
    padding-inline: var(--vd-space-4);
    display: inline-flex;
    align-items: center;
    gap: var(--vd-space-2);
    background: var(--vd-warning-bg);
    border: var(--vd-border-hairline) dashed var(--vd-warning);
    color: var(--vd-warning);
    font-size: var(--vd-label-size);
    font-weight: 500;
}
.te-site--vcedump .pk-q-flag[aria-pressed="true"],
.te-site--vcedump .pk-q-flag.is-flagged {
    background: var(--vd-warning);
    border-style: solid;
    color: var(--vd-n-0);
}

/* 按钮 → vd-btn */
.te-site--vcedump .pk-btn {
    min-height: var(--vd-touch-min);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--vd-space-2);
    padding-inline: var(--vd-space-5);
    font-family: inherit;
    font-size: var(--vd-body-size);
    font-weight: 500;
}
.te-site--vcedump .pk-btn-primary {
    background: var(--vd-green-600);
    border: var(--vd-border-hairline) solid var(--vd-green-600);
    color: var(--vd-text-on-brand);
}
.te-site--vcedump .pk-btn-primary:hover {
    background: var(--vd-green-700);
    border-color: var(--vd-green-700);
    color: var(--vd-text-on-brand);
}
.te-site--vcedump .pk-btn-secondary {
    background: var(--vd-n-0);
    border: var(--vd-border-hairline) solid var(--vd-green-600);
    color: var(--vd-green-700);
}
.te-site--vcedump .pk-btn-secondary:hover { background: var(--vd-green-50); }
.te-site--vcedump .pk-btn:focus-visible {
    outline: none;
    box-shadow: var(--vd-focus-ring);
}

/* 侧栏卡片 → vd-card + vd-card--pad */
.te-site--vcedump .pk-side-card {
    background: var(--vd-surface-card);
    border: var(--vd-border-hairline) solid var(--vd-border-divider);
    padding: var(--vd-space-5) var(--vd-space-6);
}
.te-site--vcedump .pk-side-title {
    font-size: var(--vd-overline-size);
    line-height: var(--vd-overline-line);
    font-weight: 500;
    letter-spacing: var(--vd-overline-track);
    text-transform: uppercase;
    color: var(--vd-text-secondary);
}

/* 题号网格 → vd-qmap / vd-qmap__cell */
.te-site--vcedump .pk-qmap {
    display: grid;
    grid-template-columns: repeat(auto-fill, var(--vd-qmap-cell));
    gap: var(--vd-space-1);
}
.te-site--vcedump .pk-qmap a,
.te-site--vcedump .pk-qmap span {
    width: var(--vd-qmap-cell);
    height: var(--vd-qmap-cell);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: var(--vd-border-hairline) solid var(--vd-border-field);
    border-radius: var(--vd-radius-sm);
    background: var(--vd-surface-card);
    font-family: var(--vd-font-mono);
    font-size: var(--vd-body-sm-size);
    color: var(--vd-text-body);
    text-decoration: none;
}
.te-site--vcedump .pk-qmap .is-flagged {
    background: var(--vd-warning-bg);
    border: var(--vd-border-strong) dashed var(--vd-warning);
}
.te-site--vcedump .pk-qmap .is-correct {
    background: var(--vd-success-bg);
    border-color: var(--vd-success);
}
.te-site--vcedump .pk-qmap .is-wrong {
    background: var(--vd-error-bg);
    border-color: var(--vd-error);
}
.te-site--vcedump .pk-qmap .is-current {
    box-shadow: inset 0 0 0 2px var(--vd-green-500);
    color: var(--vd-n-900);
}

/* 解析块 → vd-answer-block */
.te-site--vcedump .pk-solution {
    background: var(--vd-surface-sunken);
    border: var(--vd-border-hairline) solid var(--vd-border-divider);
    border-left: var(--vd-alert-rail) solid var(--vd-green-500);
    border-radius: var(--vd-radius-md);
    padding: var(--vd-space-4) var(--vd-space-5);
    max-width: var(--vd-reading-max);
}
.te-site--vcedump .pk-solution-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px var(--vd-space-2);
    border-radius: var(--vd-radius-pill);
    background: var(--vd-green-50);
    border: var(--vd-border-hairline) solid var(--vd-green-200);
    color: var(--vd-green-700);
    font-size: var(--vd-overline-size);
    font-weight: 500;
    letter-spacing: var(--vd-overline-track);
    text-transform: uppercase;
}
.te-site--vcedump .pk-solution-answer {
    font-family: var(--vd-font-mono);
    font-size: var(--vd-code-size);
    color: var(--vd-green-700);
}

/* 提示条 → vd-alert */
.te-site--vcedump .pk-alert {
    border-radius: var(--vd-radius-md);
    border: var(--vd-border-hairline) solid var(--vd-border-divider);
    border-left: var(--vd-alert-rail) solid var(--vd-border-divider);
    padding: var(--vd-space-3) var(--vd-space-4);
    font-size: var(--vd-body-size);
}
.te-site--vcedump .pk-alert-success {
    background: var(--vd-success-bg);
    border-color: var(--vd-success);
    color: var(--vd-text-body);
}
.te-site--vcedump .pk-alert-error {
    background: var(--vd-error-bg);
    border-color: var(--vd-error);
    color: var(--vd-text-body);
}

/* 顶栏改成品牌绿后，原本假设浅色底的子元素要跟着换到 on-brand 配色，
   否则会出现白底白字（退出按钮）和低对比徽标（SKU、品牌名）。*/
.te-site--vcedump .pk-player-exit {
    background: transparent;
    border: var(--vd-border-hairline) solid rgba(255, 255, 255, 0.4);
    color: var(--vd-n-0);
}
.te-site--vcedump .pk-player-exit:hover {
    background: rgba(255, 255, 255, 0.16);
    color: var(--vd-n-0);
}
.te-site--vcedump .pk-player-sku {
    background: rgba(255, 255, 255, 0.14);
    border-color: rgba(255, 255, 255, 0.4);
}
.te-site--vcedump .te-brand,
.te-site--vcedump .te-workspace-header .te-brand__name {
    color: var(--vd-n-0);
}
/* 站点图标是深色 mark，压在绿底上会糊掉，垫一层白底 */
.te-site--vcedump .te-brand__site-icon {
    background-color: var(--vd-n-0);
}

/* 站点 logo.svg 烤了深色底板（旧主题遗留），压在绿品牌条上是一块突兀的深色。
   这里只在引擎品牌条上换成透明底变体，不改 site_configs.logo_url，
   也不动原文件 —— 主站头部用的是 CSS logo，不受影响。 */
.te-site--vcedump .pk-player-head .te-brand__image {
    content: url("/themes/vcedump/img/brand/logo-on-brand.svg");
}

/* Practice Center 和考试结果使用浅色顶栏，不能继续显示自带深色底板的旧 logo.svg。
   使用同一品牌图形的透明浅底版本；只改展示资源，不改共享品牌数据。 */
.te-site--vcedump .te-practice-header .te-brand__image,
.te-site--vcedump .te-result-header .te-brand__image {
    content: url("/themes/vcedump/img/brand/logo-on-light.svg");
}

/* Let the exam identity use the real remaining header width. An arbitrary
   440px clamp hid valid product names even on very wide screens. */
.te-site--vcedump .te-practice-identity {
    flex: 1 1 auto;
    min-width: 0;
}

.te-site--vcedump .te-practice-exam-name {
    max-width: none;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

/* 题号在设计稿里是纯等宽文字，不是深色药丸 */
.te-site--vcedump .pk-q-no {
    min-width: 0;
    height: auto;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: var(--vd-text-secondary);
    font-weight: 500;
}

/* 共享视图在若干处把品牌蓝写进了行内 style 属性（practice-center 5 处、
   exam-result 1 处、my-exams 1 处），外部样式表按常规覆盖不到。
   这里用属性选择器精确改写这几个值，不去动共享视图本身。
   格式依赖视图里的写法 `color:#0866d6`（无空格）—— 若共享视图改了颜色写法，
   这几条会自动失效并退回原色，不会造成破版。 */
.te-site--vcedump [style*="color:#0866d6" i] { color: var(--vd-green-700) !important; }
.te-site--vcedump [style*="background:#0866d6" i] { background-color: var(--vd-green-600) !important; }
.te-site--vcedump [style*="background:#eaf1fc" i] { background-color: var(--vd-green-50) !important; }

/* 箭头图标把品牌蓝写成了 SVG 表现属性 stroke="#0866d6"。表现属性优先级低于
   任何 CSS 规则，所以这里不需要 !important。 */
.te-site--vcedump svg[stroke="#0866d6" i] { stroke: var(--vd-green-700); }
.te-site--vcedump svg[fill="#0866d6" i] { fill: var(--vd-green-700); }

/* 选项字母：基础样式是 30x30 灰色方块，设计稿是纯等宽字母。
   正文包在 <p> 里带默认外边距，会把首行压到字母下方 —— 归零后两者首行对齐。 */
.te-site--vcedump .pk-opt-letter {
    width: 1.5em;
    height: auto;
    border-radius: 0;
    background: transparent;
    display: block;
    justify-content: flex-start;
    line-height: var(--vd-body-line);
    color: var(--vd-text-secondary);
}
.te-site--vcedump .pk-opt-content {
    line-height: var(--vd-body-line);
}
.te-site--vcedump .pk-opt-content > :first-child { margin-top: 0; }
.te-site--vcedump .pk-opt-content > :last-child { margin-bottom: 0; }
.te-site--vcedump .pk-opt.selected .pk-opt-letter { background: transparent; color: var(--vd-green-700); }
.te-site--vcedump .pk-opt.correct .pk-opt-letter { background: transparent; color: var(--vd-success); }
.te-site--vcedump .pk-opt.wrong .pk-opt-letter { background: transparent; color: var(--vd-error); }

@media (max-width: 760px) {
    .te-site--vcedump .te-practice-header {
        height: auto !important;
        min-height: 58px;
        padding-block: var(--vd-space-2) !important;
        flex-wrap: wrap;
    }

    .te-site--vcedump .te-practice-identity {
        order: 5;
        flex-basis: 100%;
        padding-block: var(--vd-space-1);
    }

    .te-site--vcedump .te-library-header {
        height: 62px !important;
        padding-inline: var(--vd-gutter-mobile) !important;
    }

    .te-site--vcedump .te-library-header .te-brand::before {
        width: 28px;
        height: 28px;
    }

    .te-site--vcedump .te-library-header .te-brand::after {
        font-size: 18px;
    }

    .te-site--vcedump .te-library-main {
        padding: 32px var(--vd-gutter-mobile) var(--vd-space-16) !important;
    }

    .te-site--vcedump .te-library-page-title {
        font-size: 29px !important;
    }

    .te-site--vcedump .te-library-empty {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--vd-space-2);
        padding: 28px 24px !important;
    }

    .te-site--vcedump .te-library-empty__title,
    .te-site--vcedump .te-library-empty__copy,
    .te-site--vcedump .te-library-empty__action {
        grid-column: 1;
    }

    .te-site--vcedump .te-library-empty__action {
        grid-row: auto;
        width: 100%;
        margin-top: var(--vd-space-3);
    }
}