/* GraphicBidu Career Studio v21 consolidated stylesheet. Source order preserved from the formerly live v8-v20 stack. */


/* ===== career-studio-app.css ===== */
.career-studio {
    --cs-ink: #12120f;
    --cs-paper: #f7f4ec;
    --cs-panel: #fffdf8;
    --cs-muted: #68645c;
    --cs-line: #dfd8cb;
    --cs-warm: #bd8d00;
    --cs-warm-dark: #745400;
    --cs-success: #2d8959;
    --cs-danger: #aa4a39;
    --cs-shadow: 0 18px 38px rgba(34, 30, 18, .08);
    color: var(--cs-ink);
    background: var(--cs-paper);
    padding: 20px 0 54px;
}

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

.career-studio button,
.career-studio input,
.career-studio select,
.career-studio textarea { font: inherit; }

.career-studio button { cursor: pointer; }
.career-studio button:disabled { cursor: not-allowed; opacity: .7; }

.career-studio .cs-shell { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.career-studio h1,
.career-studio h2,
.career-studio h3,
.career-studio p { margin-top: 0; }
.career-studio h1 { max-width: 860px; margin-bottom: 16px; font-size: clamp(2.5rem, 5.6vw, 5.3rem); line-height: .94; letter-spacing: -.075em; }
.career-studio h2 { margin-bottom: 10px; font-size: clamp(1.8rem, 3vw, 2.55rem); line-height: 1; letter-spacing: -.055em; }
.career-studio h3 { margin-bottom: 6px; letter-spacing: -.03em; }

.career-studio .cs-local-bar {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    padding: 11px 12px;
    border: 1px solid var(--cs-line);
    border-radius: 13px;
    background: rgba(255, 253, 248, .75);
}

.career-studio .cs-local-copy,
.career-studio .cs-local-actions,
.career-studio .cs-toolbar-actions,
.career-studio .cs-preview-actions,
.career-studio .cs-builder-footer-actions,
.career-studio .cs-photo-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.career-studio .cs-local-copy p { margin: 0; color: var(--cs-muted); font-size: .85rem; }
.career-studio .cs-local-pill { display: inline-flex; padding: 5px 9px; border: 1px solid #d7b660; border-radius: 999px; color: var(--cs-warm-dark); font-size: .73rem; font-weight: 850; letter-spacing: .03em; text-transform: uppercase; white-space: nowrap; }
.career-studio .cs-draft-state { color: var(--cs-muted); font-size: .8rem; font-weight: 700; }

.career-studio .cs-hero { display: grid; grid-template-columns: minmax(0, 1fr) 285px; align-items: center; gap: 52px; padding: 50px 0 36px; }
.career-studio .cs-hero-copy { max-width: 760px; margin-bottom: 17px; color: var(--cs-muted); font-size: 1.03rem; line-height: 1.62; }
.career-studio .cs-eyebrow { margin-bottom: 12px; color: var(--cs-warm-dark); font-size: .73rem; font-weight: 900; letter-spacing: .13em; }
.career-studio .cs-hero-points { display: flex; gap: 8px; flex-wrap: wrap; }
.career-studio .cs-hero-points span { padding: 6px 9px; border: 1px solid var(--cs-line); border-radius: 999px; color: #45413b; background: rgba(255,253,248,.6); font-size: .78rem; font-weight: 750; }

.career-studio .cs-truth-card { display: grid; grid-template-columns: 33px 1fr; gap: 13px; padding: 21px; border-radius: 18px; color: #fdfbf5; background: #191814; box-shadow: var(--cs-shadow); }
.career-studio .cs-truth-icon { display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid #e2bd58; border-radius: 50%; color: #e2bd58; }
.career-studio .cs-truth-card strong { display: block; margin-bottom: 6px; }
.career-studio .cs-truth-card p { margin: 0; color: #e6dfd0; font-size: .84rem; line-height: 1.52; }

.career-studio .cs-progress-wrap { margin-bottom: 22px; border: 1px solid var(--cs-line); border-radius: 15px; background: rgba(255,253,248,.66); overflow: hidden; }
.career-studio .cs-progress-steps { display: flex; gap: 8px; padding: 8px; overflow-x: auto; }
.career-studio .cs-progress-step { display: inline-flex; align-items: center; gap: 9px; min-width: max-content; padding: 10px 13px; border: 0; border-radius: 10px; color: var(--cs-muted); background: transparent; font-size: .87rem; font-weight: 850; }
.career-studio .cs-progress-step span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--cs-muted); background: #ece6da; font-size: .7rem; }
.career-studio .cs-progress-step.is-active { color: #fffdf8; background: var(--cs-ink); }
.career-studio .cs-progress-step.is-active span { color: var(--cs-ink); background: #dcb64d; }

.career-studio .cs-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(310px, .72fr); gap: 24px; align-items: start; }
.career-studio .cs-workspace,
.career-studio .cs-insights { min-width: 0; }
.career-studio .cs-panel,
.career-studio .cs-insight-card,
.career-studio .cs-preview-card { border: 1px solid var(--cs-line); border-radius: 18px; background: var(--cs-panel); box-shadow: var(--cs-shadow); }
.career-studio .cs-panel { padding: clamp(21px, 3.4vw, 35px); }
.career-studio .cs-panel-heading { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 28px; }
.career-studio .cs-panel-heading > div > p:last-child { max-width: 680px; margin-bottom: 0; color: var(--cs-muted); line-height: 1.55; }

.career-studio .cs-builder-toolbar { display: flex; justify-content: space-between; gap: 18px; align-items: center; margin-bottom: 28px; padding: 14px 15px; border: 1px solid #ded6c6; border-radius: 14px; background: #fbf8ef; }
.career-studio .cs-toolbar-label { display: block; margin-bottom: 3px; color: var(--cs-muted); font-size: .74rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.career-studio .cs-builder-toolbar strong { display: block; font-size: .98rem; }
.career-studio .cs-builder-toolbar p { margin: 4px 0 0; color: var(--cs-muted); font-size: .82rem; }

.career-studio .cs-form-section { padding-top: 24px; margin-top: 25px; border-top: 1px solid var(--cs-line); }
.career-studio .cs-section-title { display: grid; grid-template-columns: minmax(0,1fr) minmax(180px,.6fr); gap: 15px; margin-bottom: 18px; }
.career-studio .cs-section-title > div { display: flex; align-items: center; gap: 10px; }
.career-studio .cs-section-title span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--cs-warm-dark); background: #f4e9c8; font-size: .78rem; font-weight: 900; }
.career-studio .cs-section-title h3 { margin: 0; font-size: 1.12rem; }
.career-studio .cs-section-title p { margin: 0; color: var(--cs-muted); font-size: .84rem; line-height: 1.45; }

.career-studio .cs-photo-row { display: grid; grid-template-columns: 98px 1fr; gap: 17px; align-items: center; margin-bottom: 22px; padding: 15px; border: 1px dashed #d6cdbd; border-radius: 14px; background: #fffdf7; }
.career-studio .cs-photo-preview { display: grid; place-items: center; width: 86px; height: 86px; overflow: hidden; border: 1px solid #cabd9b; border-radius: 50%; color: #5f512e; background: #eee7d7; font-weight: 900; letter-spacing: .04em; }
.career-studio .cs-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.career-studio .cs-photo-copy strong { display: block; margin-bottom: 4px; }
.career-studio .cs-photo-copy em { color: var(--cs-muted); font-size: .78rem; font-style: normal; font-weight: 700; }
.career-studio .cs-photo-copy p { margin-bottom: 10px; color: var(--cs-muted); font-size: .83rem; line-height: 1.45; }
.career-studio .cs-checkbox-line { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 8px; margin: 10px 0 0 !important; color: #514d46 !important; font-size: .82rem !important; font-weight: 650 !important; }
.career-studio .cs-checkbox-line input { width: auto; }
.career-studio .cs-file-button { display: inline-flex; align-items: center; }

.career-studio .cs-form-grid { display: grid; gap: 15px; }
.career-studio .cs-form-grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.career-studio .cs-form-grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.career-studio label { display: grid; gap: 7px; margin-bottom: 15px; color: #393631; font-size: .86rem; font-weight: 850; }
.career-studio .cs-field-hint { display: inline; width: auto; height: auto; margin-left: 4px; color: var(--cs-muted); background: transparent; font-size: .72rem; font-weight: 650; }
.career-studio input,
.career-studio select,
.career-studio textarea { width: 100%; border: 1px solid #d7d0c3; border-radius: 10px; color: var(--cs-ink); background: #fffefa; padding: 11px 12px; outline: none; font-weight: 560; }
.career-studio textarea { min-height: 106px; resize: vertical; line-height: 1.52; }
.career-studio input:focus,
.career-studio select:focus,
.career-studio textarea:focus { border-color: var(--cs-warm); box-shadow: 0 0 0 4px rgba(189,141,0,.12); }

.career-studio .cs-repeat-list { display: grid; gap: 14px; margin-bottom: 14px; }
.career-studio .cs-repeat-card { padding: 16px; border: 1px solid #dcd4c7; border-radius: 15px; background: #fffefa; }
.career-studio .cs-repeat-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 15px; }
.career-studio .cs-repeat-card-head strong { font-size: .95rem; }
.career-studio .cs-icon-button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #e1c5bd; border-radius: 8px; color: var(--cs-danger); background: #fff6f4; font-size: 1rem; }
.career-studio .cs-date-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.career-studio .cs-current-line { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 8px; margin-top: -4px !important; color: var(--cs-muted) !important; font-size: .8rem !important; font-weight: 650 !important; }
.career-studio .cs-current-line input { width: auto; }

.career-studio .cs-skill-builder { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; margin-bottom: 10px; }
.career-studio .cs-suggestion-row,
.career-studio .cs-skill-list { display: flex; flex-wrap: wrap; gap: 8px; }
.career-studio .cs-suggestion-row { margin-bottom: 12px; }
.career-studio .cs-suggestion-button,
.career-studio .cs-skill-chip { display: inline-flex; align-items: center; gap: 7px; padding: 6px 8px; border: 1px solid #dcd4c5; border-radius: 999px; color: #504b42; background: #faf7ef; font-size: .79rem; font-weight: 750; }
.career-studio .cs-suggestion-button:hover { border-color: var(--cs-warm); background: #fff5d9; }
.career-studio .cs-skill-chip button { width: 16px; height: 16px; padding: 0; border: 0; color: var(--cs-muted); background: transparent; font-size: 1rem; line-height: 1; }
.career-studio .cs-empty-inline { margin: 0; color: var(--cs-muted); font-size: .84rem; }

.career-studio .cs-builder-footer { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-top: 28px; padding: 16px; border: 1px solid #dacb9f; border-radius: 14px; background: #fff9e9; }
.career-studio .cs-builder-footer strong { display: block; margin-bottom: 4px; }
.career-studio .cs-builder-footer p { margin: 0; color: var(--cs-muted); font-size: .84rem; line-height: 1.42; }

.career-studio .cs-form-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 14px; }
.career-studio .cs-form-note { margin: 0; color: var(--cs-muted); font-size: .83rem; line-height: 1.45; }
.career-studio .cs-button { border: 1px solid transparent; border-radius: 10px; padding: 10px 13px; font-weight: 850; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.career-studio .cs-button:hover { transform: translateY(-1px); }
.career-studio .cs-button-primary { color: #fff; background: var(--cs-ink); box-shadow: 0 8px 20px rgba(0,0,0,.13); }
.career-studio .cs-button-secondary { border-color: #cdbb94; color: var(--cs-warm-dark); background: #fffbf1; }
.career-studio .cs-button-quiet { padding: 8px 10px; border-color: var(--cs-line); color: var(--cs-ink); background: transparent; font-size: .82rem; }
.career-studio .cs-text-button { padding: 0; border: 0; color: var(--cs-warm-dark); background: transparent; font-size: .8rem; font-weight: 850; text-decoration: underline; text-underline-offset: 3px; }

.career-studio .cs-insights { display: grid; gap: 15px; position: sticky; top: 92px; }
.career-studio .cs-preview-card { padding: 16px; }
.career-studio .cs-insight-card { padding: 18px; box-shadow: none; }
.career-studio .cs-insight-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; color: var(--cs-muted); font-size: .76rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.career-studio .cs-insight-heading strong { color: var(--cs-ink); font-size: .87rem; letter-spacing: 0; text-transform: none; }
.career-studio .cs-resume-preview { min-height: 410px; margin: 13px 0; padding: 18px; overflow: auto; border: 1px solid #dcd4c7; border-radius: 11px; color: #25231e; background: #fff; font-family: Arial, Helvetica, sans-serif; }
.career-studio .cs-preview-empty { display: grid; place-items: center; height: 360px; padding: 18px; color: #77716a; text-align: center; font-size: .86rem; line-height: 1.5; }
.career-studio .cs-resume-header { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 14px; align-items: start; padding-bottom: 12px; margin-bottom: 13px; border-bottom: 2px solid #222; }
.career-studio .cs-resume-name { margin: 0 0 3px; color: #111; font-size: 1.35rem; line-height: 1.05; letter-spacing: -.04em; }
.career-studio .cs-resume-role { margin: 0 0 8px; color: #48433b; font-size: .82rem; font-weight: 700; }
.career-studio .cs-resume-contact { display: flex; gap: 4px 8px; flex-wrap: wrap; color: #514c44; font-size: .67rem; line-height: 1.45; }
.career-studio .cs-resume-photo { width: 52px; height: 52px; overflow: hidden; border-radius: 50%; border: 1px solid #c7c0b3; }
.career-studio .cs-resume-photo img { width: 100%; height: 100%; object-fit: cover; }
.career-studio .cs-resume-section { margin-top: 13px; }
.career-studio .cs-resume-section h4 { margin: 0 0 6px; padding-bottom: 3px; border-bottom: 1px solid #b8b2a8; color: #111; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; }
.career-studio .cs-resume-section p,
.career-studio .cs-resume-section li { color: #35312b; font-size: .68rem; line-height: 1.46; }
.career-studio .cs-resume-section p { margin: 0; }
.career-studio .cs-resume-section ul { margin: 5px 0 0; padding-left: 15px; }
.career-studio .cs-preview-job { margin-bottom: 8px; }
.career-studio .cs-preview-job strong { display: block; color: #161513; font-size: .72rem; }
.career-studio .cs-preview-job span { color: #635d53; font-size: .64rem; }
.career-studio .cs-preview-job ul { margin-top: 3px; }
.career-studio .cs-resume-skills { display: flex; flex-wrap: wrap; gap: 5px; }
.career-studio .cs-resume-skills span { padding: 3px 5px; border-radius: 4px; color: #454038; background: #f1eee7; font-size: .64rem; }
.career-studio .cs-resume-link { display: block; overflow-wrap: anywhere; color: #37332c; font-size: .67rem; line-height: 1.42; }
.career-studio .cs-preview-actions { justify-content: stretch; }
.career-studio .cs-preview-actions .cs-button { flex: 1; }

.career-studio .cs-score-card { text-align: center; }
.career-studio .cs-score-card .cs-insight-heading { text-align: left; }
.career-studio .cs-score-ring { position: relative; display: grid; place-items: center; width: 126px; height: 126px; margin: 17px auto 12px; border-radius: 50%; background: conic-gradient(var(--cs-warm) 0deg, #eae3d7 0deg); }
.career-studio .cs-score-ring::after { content: ""; position: absolute; width: 98px; height: 98px; border-radius: 50%; background: var(--cs-panel); }
.career-studio .cs-score-ring span { position: relative; z-index: 1; font-size: 1.75rem; font-weight: 900; letter-spacing: -.07em; }
.career-studio .cs-score-card p { margin: 0; color: var(--cs-muted); font-size: .84rem; line-height: 1.45; }

.career-studio .cs-insight-list { display: grid; gap: 10px; padding: 0; margin: 15px 0 0; list-style: none; }
.career-studio .cs-insight-list li { display: flex; gap: 9px; align-items: flex-start; color: #39362f; font-size: .84rem; line-height: 1.38; }
.career-studio .cs-status-dot { flex: 0 0 auto; width: 8px; height: 8px; margin-top: 5px; border-radius: 50%; background: #c9c4bb; }
.career-studio .cs-status-dot.is-good { background: var(--cs-success); }
.career-studio .cs-status-dot.is-watch { background: var(--cs-warm); }
.career-studio .cs-status-dot.is-risk { background: var(--cs-danger); }
.career-studio .cs-job-match-content,
.career-studio .cs-truth-insight p { margin-top: 13px; color: var(--cs-muted); font-size: .85rem; line-height: 1.48; }
.career-studio .cs-job-match-content p:last-child,
.career-studio .cs-truth-insight p:last-child { margin-bottom: 0; }
.career-studio .cs-match-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 8px 0 13px; }
.career-studio .cs-chip { padding: 5px 8px; border-radius: 999px; color: #574e3f; background: #f0eadb; font-size: .74rem; font-weight: 750; }
.career-studio .cs-chip.missing { color: #934639; background: #fae7e2; }
.career-studio .cs-mini-label { margin: 0; color: #3c3935; font-size: .8rem; font-weight: 850; }
.career-studio .cs-truth-insight { border-color: #dfc98f; background: #fff9e9; }

.career-studio .cs-job-result { margin-top: 20px; padding: 18px; border: 1px solid #dccfae; border-radius: 14px; background: #fffaf0; }
.career-studio .cs-job-result h3 { margin-bottom: 7px; }
.career-studio .cs-job-result p { color: var(--cs-muted); line-height: 1.52; }
.career-studio .cs-job-result-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; margin-top: 15px; }
.career-studio .cs-job-result-block { padding: 13px; border: 1px solid #e2d8c4; border-radius: 11px; background: #fffefa; }
.career-studio .cs-job-result-block h4 { margin: 0 0 8px; font-size: .88rem; }

.career-studio .cs-review-checklist { display: grid; gap: 12px; }
.career-studio .cs-review-item { display: grid; grid-template-columns: 34px 1fr; gap: 11px; padding: 13px; border: 1px solid var(--cs-line); border-radius: 12px; background: #fffefa; }
.career-studio .cs-review-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--cs-muted); background: #ebe5da; font-size: .88rem; }
.career-studio .cs-review-item.is-good .cs-review-icon { color: var(--cs-success); background: #dbeee4; }
.career-studio .cs-review-item.is-watch .cs-review-icon { color: var(--cs-warm-dark); background: #f5e8c9; }
.career-studio .cs-review-item.is-risk .cs-review-icon { color: var(--cs-danger); background: #f7e1dc; }
.career-studio .cs-review-item h3 { margin: 0 0 4px; font-size: .92rem; }
.career-studio .cs-review-item p { margin: 0; color: var(--cs-muted); font-size: .84rem; line-height: 1.45; }

.career-studio .cs-game-card { padding: clamp(20px,4vw,33px); border: 1px solid #cfb875; border-radius: 16px; background: linear-gradient(145deg,#fff7df,#faf0d7); text-align: center; }
.career-studio .cs-game-topline { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--cs-muted); font-size: .8rem; font-weight: 850; }
.career-studio .cs-confidence-meter { color: var(--cs-warm-dark); }
.career-studio .cs-bias-shield { display: grid; place-items: center; width: 122px; height: 122px; margin: 24px auto; border-radius: 50% 50% 44% 44%; background: radial-gradient(circle at 35% 30%,#4a4036,#191815); box-shadow: inset 0 0 0 8px #b99763, 0 16px 26px rgba(49,36,15,.16); transition: transform .35s ease, filter .35s ease; }
.career-studio .cs-bias-shield.is-cracked { transform: rotate(-8deg) scale(.92); filter: saturate(.7); }
.career-studio .cs-shield-core { display: grid; place-items: center; width: 90px; height: 90px; border: 1px solid #f1d295; border-radius: 50%; color: #f4deb1; font-size: .82rem; font-weight: 900; line-height: 1; letter-spacing: .08em; }
.career-studio .cs-answer-list { display: grid; gap: 10px; max-width: 660px; margin: 18px auto; text-align: left; }
.career-studio .cs-answer-button { width: 100%; padding: 12px 14px; border: 1px solid #d5c8b3; border-radius: 10px; color: var(--cs-ink); background: #fffdfa; text-align: left; font-weight: 700; }
.career-studio .cs-answer-button:hover:not(:disabled) { border-color: var(--cs-warm); background: #fff7e5; }
.career-studio .cs-answer-button.is-correct { border-color: var(--cs-success); background: #e8f5ed; }
.career-studio .cs-answer-button.is-wrong { border-color: var(--cs-danger); background: #fbecea; }
.career-studio .cs-game-feedback { min-height: 44px; max-width: 680px; margin: 14px auto; color: var(--cs-muted); font-size: .88rem; line-height: 1.5; }

.career-studio .cs-local-note { margin: 22px 0 0; color: var(--cs-muted); font-size: .8rem; text-align: center; }
.career-studio [hidden] { display: none !important; }

@media (max-width: 1080px) {
    .career-studio .cs-grid { grid-template-columns: 1fr; }
    .career-studio .cs-insights { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); }
    .career-studio .cs-preview-card { grid-column: 1 / -1; }
    .career-studio .cs-resume-preview { min-height: 300px; }
}

@media (max-width: 780px) {
    .career-studio { padding-top: 14px; }
    .career-studio .cs-shell { width: min(100% - 28px, 1180px); }
    .career-studio .cs-local-bar,
    .career-studio .cs-hero,
    .career-studio .cs-builder-toolbar,
    .career-studio .cs-builder-footer { display: grid; grid-template-columns: 1fr; }
    .career-studio .cs-hero { gap: 24px; padding: 34px 0 28px; }
    .career-studio .cs-truth-card { max-width: 390px; }
    .career-studio .cs-form-grid-3,
    .career-studio .cs-form-grid-2,
    .career-studio .cs-section-title,
    .career-studio .cs-insights,
    .career-studio .cs-job-result-grid { grid-template-columns: 1fr; }
    .career-studio .cs-panel-heading { display: grid; }
    .career-studio .cs-photo-row { grid-template-columns: 72px 1fr; }
    .career-studio .cs-photo-preview { width: 68px; height: 68px; }
    .career-studio .cs-date-grid { grid-template-columns: 1fr; }
    .career-studio .cs-toolbar-actions .cs-button,
    .career-studio .cs-builder-footer-actions .cs-button { flex: 1; }
}



/* Career Studio v5 — real-contact cartoon kick arena (slapstick, no graphic injury) */
.career-studio .cs-game-card-v4 { overflow: hidden; }
.career-studio .cs-game-arena { position: relative; min-height: 342px; margin: 18px 0 24px; overflow: hidden; border: 1px solid #d9c47e; border-radius: 18px; background: linear-gradient(180deg, #fff9dd 0%, #fff4c7 100%); isolation: isolate; }
.career-studio .cs-game-arena::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .6; background-image: radial-gradient(circle at 18% 18%, rgba(255,255,255,.95) 0 2px, transparent 2.5px), radial-gradient(circle at 84% 28%, rgba(255,255,255,.75) 0 2px, transparent 2.5px); background-size: 50px 50px, 66px 66px; }
.career-studio .cs-game-arena-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; border-bottom: 1px solid rgba(169,134,31,.3); color: #6d5320; font-size: .74rem; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.career-studio .cs-game-mode-tag { display: inline-flex; align-items: center; min-height: 26px; padding: 0 9px; border: 1px solid #c8a54a; border-radius: 999px; background: #fffaf0; color: #7f5e07; font-size: .64rem; }
.career-studio .cs-game-action-label { text-align: right; }
.career-studio .cs-game-floor { position: absolute; right: 8%; bottom: 39px; left: 8%; height: 5px; border-radius: 999px; background: repeating-linear-gradient(90deg, #b89947 0 18px, transparent 18px 29px); opacity: .7; }
.career-studio .cs-fighter { position: absolute; bottom: 37px; z-index: 2; width: 130px; text-align: center; filter: drop-shadow(0 11px 10px rgba(100,68,11,.12)); will-change: transform; }
.career-studio .cs-fighter--candidate { left: 8%; }
.career-studio .cs-fighter--recruiter { right: 8%; }
.career-studio .cs-fighter svg { display: block; width: 100%; height: auto; overflow: visible; }
.career-studio .cs-fighter-label { display: inline-flex; margin-bottom: -1px; padding: 5px 8px; border: 1px solid #dac98e; border-radius: 999px; background: #fffdf7; color: #55472e; font-size: .64rem; font-weight: 900; letter-spacing: .06em; }
.career-studio .cs-fighter--recruiter .cs-fighter-label { color: #8c3e30; border-color: #dfb4a9; background: #fff7f4; }
.career-studio .cs-line-head, .career-studio .cs-line-body, .career-studio .cs-line-arm, .career-studio .cs-line-leg, .career-studio .cs-line-foot, .career-studio .cs-line-torso, .career-studio .cs-line-hair, .career-studio .cs-line-mouth, .career-studio .cs-line-glasses, .career-studio .cs-line-tie { fill: none; stroke: #1a1a18; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.career-studio .cs-line-head { fill: #fffdf7; }
.career-studio .cs-line-eye { fill: #1a1a18; }
.career-studio .cs-line-glasses { stroke-width: 3.4; }
.career-studio .cs-line-tie { fill: #d29d24; stroke-width: 3; }
.career-studio .cs-strike-leg { transform-box: view-box; }
.career-studio .cs-candidate-kick-leg { transform-origin: 68px 120px; }
.career-studio .cs-recruiter-kick-leg { transform-origin: 64px 120px; }
.career-studio .cs-bias-shield-v4 { position: absolute; top: 84px; left: 50%; z-index: 3; width: 94px; height: 94px; margin: 0; transform: translateX(-50%); transition: transform .35s ease, filter .35s ease, opacity .35s ease; }
.career-studio .cs-bias-shield-v4 .cs-shield-core { width: 69px; height: 69px; font-size: .66rem; }
.career-studio .cs-game-speech { position: absolute; top: 94px; z-index: 4; max-width: 150px; padding: 9px 11px; border: 1px solid #d8c691; border-radius: 12px; background: #fffdf9; color: #544a38; font-size: .72rem; font-weight: 750; line-height: 1.35; box-shadow: 0 8px 15px rgba(80,54,11,.08); }
.career-studio .cs-game-speech::after { content: ''; position: absolute; bottom: -6px; width: 11px; height: 11px; border-right: 1px solid #d8c691; border-bottom: 1px solid #d8c691; background: #fffdf9; transform: rotate(45deg); }
.career-studio .cs-game-speech-candidate { left: 5%; }
.career-studio .cs-game-speech-candidate::after { right: 22px; }
.career-studio .cs-game-speech-recruiter { right: 5%; border-color: #e1b9ad; background: #fff8f5; color: #7d4339; }
.career-studio .cs-game-speech-recruiter::after { left: 22px; border-color: #e1b9ad; background: #fff8f5; }
.career-studio .cs-fight-burst { position: absolute; top: 152px; left: 50%; z-index: 8; display: grid; place-items: center; width: 86px; height: 86px; border-radius: 42% 58% 49% 51%; color: #fff; background: #191815; box-shadow: inset 0 0 0 8px #c6a04b, 0 10px 19px rgba(91,61,5,.19); font-size: 1rem; font-weight: 1000; letter-spacing: .05em; transform: translateX(-50%) scale(.45); opacity: 0; pointer-events: none; }
.career-studio .cs-motion-lines { position: absolute; top: 184px; z-index: 1; display: flex; gap: 8px; opacity: 0; }
.career-studio .cs-motion-lines i { display: block; width: 26px; height: 4px; border-radius: 999px; background: #c39c32; }
.career-studio .cs-motion-lines-candidate { left: 17%; }
.career-studio .cs-motion-lines-recruiter { right: 17%; transform: scaleX(-1); }
.career-studio .cs-game-arena-caption { position: absolute; right: 10%; bottom: 7px; left: 10%; z-index: 2; margin: 0; color: #766448; font-size: .7rem; line-height: 1.35; text-align: center; }

/* Actual run-in + kick contact: attacker travels into the other character before the impact. */
.career-studio .cs-game-arena.is-candidate-win .cs-fighter--candidate { animation: cs-candidate-charge-kick 1.38s cubic-bezier(.19,.79,.2,1) both; }
.career-studio .cs-game-arena.is-candidate-win .cs-candidate-kick-leg { animation: cs-candidate-leg-kick 1.38s ease-in-out both; }
.career-studio .cs-game-arena.is-candidate-win .cs-fighter--recruiter { animation: cs-recruiter-hit-right 1.38s cubic-bezier(.2,.8,.2,1) both; }
.career-studio .cs-game-arena.is-candidate-win .cs-bias-shield-v4 { animation: cs-shield-flight-right 1.38s ease both; }
.career-studio .cs-game-arena.is-candidate-win .cs-kick-impact { left: 72%; animation: cs-kick-impact .45s .72s cubic-bezier(.2,.8,.2,1) both; }
.career-studio .cs-game-arena.is-candidate-win .cs-motion-lines-candidate { animation: cs-motion-lines-right .44s .2s ease-out both; }

.career-studio .cs-game-arena.is-recruiter-win .cs-fighter--recruiter { animation: cs-recruiter-charge-kick 1.38s cubic-bezier(.19,.79,.2,1) both; }
.career-studio .cs-game-arena.is-recruiter-win .cs-recruiter-kick-leg { animation: cs-recruiter-leg-kick 1.38s ease-in-out both; }
.career-studio .cs-game-arena.is-recruiter-win .cs-fighter--candidate { animation: cs-candidate-hit-left 1.38s cubic-bezier(.2,.8,.2,1) both; }
.career-studio .cs-game-arena.is-recruiter-win .cs-bias-shield-v4 { animation: cs-shield-shake 1.38s ease both; }
.career-studio .cs-game-arena.is-recruiter-win .cs-kick-impact { left: 28%; animation: cs-kick-impact .45s .72s cubic-bezier(.2,.8,.2,1) both; }
.career-studio .cs-game-arena.is-recruiter-win .cs-motion-lines-recruiter { animation: cs-motion-lines-left .44s .2s ease-out both; }
.career-studio .cs-game-arena.is-candidate-win .cs-game-speech-candidate, .career-studio .cs-game-arena.is-recruiter-win .cs-game-speech-recruiter { animation: cs-speech-hop .45s .18s ease both; }
.career-studio .cs-game-arena.is-complete .cs-bias-shield-v4 { opacity: .78; transform: translateX(-50%) rotate(-11deg) scale(.88); }
.career-studio .cs-game-arena.is-complete .cs-fighter--candidate { animation: cs-celebrate .85s ease-in-out infinite alternate; }
.career-studio .cs-game-arena.is-complete .cs-fight-burst { opacity: .95; transform: translateX(-50%) scale(1); }

@keyframes cs-candidate-charge-kick {
  0% { transform: translateX(0) rotate(0); }
  25% { transform: translateX(78px) rotate(-4deg); }
  55% { transform: translateX(248px) rotate(3deg); }
  67% { transform: translateX(258px) rotate(-3deg); }
  100% { transform: translateX(0) rotate(0); }
}
@keyframes cs-recruiter-charge-kick {
  0% { transform: translateX(0) rotate(0); }
  25% { transform: translateX(-78px) rotate(4deg); }
  55% { transform: translateX(-248px) rotate(-3deg); }
  67% { transform: translateX(-258px) rotate(3deg); }
  100% { transform: translateX(0) rotate(0); }
}
@keyframes cs-candidate-leg-kick {
  0%, 43%, 82%, 100% { transform: rotate(0deg); }
  55%, 67% { transform: rotate(-62deg) translate(0,-3px); }
}
@keyframes cs-recruiter-leg-kick {
  0%, 43%, 82%, 100% { transform: rotate(0deg); }
  55%, 67% { transform: rotate(62deg) translate(0,-3px); }
}
@keyframes cs-recruiter-hit-right {
  0%, 53% { transform: translateX(0) rotate(0); }
  61% { transform: translateX(28px) rotate(13deg); }
  73% { transform: translateX(56px) rotate(20deg); }
  100% { transform: translateX(0) rotate(0); }
}
@keyframes cs-candidate-hit-left {
  0%, 53% { transform: translateX(0) rotate(0); }
  61% { transform: translateX(-28px) rotate(-13deg); }
  73% { transform: translateX(-56px) rotate(-20deg); }
  100% { transform: translateX(0) rotate(0); }
}
@keyframes cs-shield-flight-right {
  0%, 52% { transform: translateX(-50%) rotate(0) scale(1); opacity: 1; }
  59% { transform: translateX(-10%) rotate(20deg) scale(1.12); }
  75% { transform: translateX(42%) rotate(52deg) scale(.84); opacity: .7; }
  100% { transform: translateX(-50%) rotate(0) scale(1); opacity: 1; }
}
@keyframes cs-shield-shake {
  0%, 45%,100% { transform: translateX(-50%) rotate(0); }
  54% { transform: translateX(-50%) rotate(-12deg); }
  63% { transform: translateX(-50%) rotate(9deg); }
  72% { transform: translateX(-50%) rotate(-5deg); }
}
@keyframes cs-kick-impact {
  0% { transform: translateX(-50%) scale(.3) rotate(-18deg); opacity: 0; }
  32% { transform: translateX(-50%) scale(1.25) rotate(10deg); opacity: 1; }
  100% { transform: translateX(-50%) scale(.82) rotate(0); opacity: .75; }
}
@keyframes cs-motion-lines-right { from { transform: translateX(-18px); opacity: 0; } 35% { opacity: .95; } to { transform: translateX(135px); opacity: 0; } }
@keyframes cs-motion-lines-left { from { transform: scaleX(-1) translateX(-18px); opacity: 0; } 35% { opacity: .95; } to { transform: scaleX(-1) translateX(135px); opacity: 0; } }
@keyframes cs-speech-hop { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes cs-celebrate { from { transform: translateY(0) rotate(-2deg); } to { transform: translateY(-8px) rotate(2deg); } }

@media (prefers-reduced-motion: reduce) { .career-studio .cs-game-arena *, .career-studio .cs-game-arena { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
@media (max-width: 760px) {
  .career-studio .cs-game-arena { min-height: 360px; }
  .career-studio .cs-fighter { width: 104px; }
  .career-studio .cs-fighter--candidate { left: 1%; }
  .career-studio .cs-fighter--recruiter { right: 1%; }
  .career-studio .cs-game-speech { top: 101px; max-width: 112px; padding: 7px 8px; font-size: .63rem; }
  .career-studio .cs-game-speech-candidate { left: 2%; }
  .career-studio .cs-game-speech-recruiter { right: 2%; }
  .career-studio .cs-bias-shield-v4 { top: 166px; width: 78px; height: 78px; }
  .career-studio .cs-bias-shield-v4 .cs-shield-core { width: 58px; height: 58px; font-size: .55rem; }
  .career-studio .cs-kick-impact { top: 176px; width: 68px; height: 68px; font-size: .75rem; }
  .career-studio .cs-game-floor { bottom: 50px; }
  .career-studio .cs-game-arena-caption { right: 7%; bottom: 10px; left: 7%; font-size: .64rem; }
  .career-studio .cs-game-arena.is-candidate-win .cs-fighter--candidate { animation-name: cs-candidate-charge-kick-mobile; }
  .career-studio .cs-game-arena.is-recruiter-win .cs-fighter--recruiter { animation-name: cs-recruiter-charge-kick-mobile; }
}
@keyframes cs-candidate-charge-kick-mobile {
  0% { transform: translateX(0); }
  55% { transform: translateX(138px) rotate(3deg); }
  67% { transform: translateX(146px) rotate(-3deg); }
  100% { transform: translateX(0); }
}
@keyframes cs-recruiter-charge-kick-mobile {
  0% { transform: translateX(0); }
  55% { transform: translateX(-138px) rotate(-3deg); }
  67% { transform: translateX(-146px) rotate(3deg); }
  100% { transform: translateX(0); }
}


/* Career Studio v7: voluntary support panel and Razorpay return state. */
.career-studio .cs-support-section {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 28px;
  align-items: center;
  margin: 28px 0 12px;
  padding: 30px;
  border: 1px solid rgba(198, 158, 38, .44);
  border-radius: 22px;
  color: #fff;
  background:
    radial-gradient(circle at 95% 6%, rgba(216, 173, 56, .23), transparent 31%),
    linear-gradient(135deg, #14130f 0%, #201d14 100%);
  box-shadow: 0 22px 42px rgba(33, 27, 12, .14);
}
.career-studio .cs-support-section .cs-eyebrow { color: #e6c45e; }
.career-studio .cs-support-section h2 { margin: 5px 0 10px; color: #fff; font-size: clamp(1.6rem, 2.4vw, 2.25rem); line-height: 1.05; }
.career-studio .cs-support-section p { max-width: 680px; color: rgba(255,255,255,.78); }
.career-studio .cs-support-fineprint { margin: 12px 0 0; font-size: .78rem; line-height: 1.55; }
.career-studio .cs-support-box { padding: 20px; border: 1px solid rgba(255,255,255,.16); border-radius: 16px; background: rgba(255,255,255,.07); }
.career-studio .cs-support-amounts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px; }
.career-studio .cs-support-amount { min-height: 42px; border: 1px solid rgba(230,196,94,.55); border-radius: 10px; color: #fff; background: transparent; font-weight: 800; cursor: pointer; }
.career-studio .cs-support-amount:hover, .career-studio .cs-support-amount:focus-visible, .career-studio .cs-support-amount.is-active { color: #16130c; border-color: #e6c45e; background: #e6c45e; outline: none; }
.career-studio .cs-support-custom-label { display: block; margin: 0 0 7px; color: rgba(255,255,255,.86); font-size: .78rem; font-weight: 800; }
.career-studio .cs-support-input-wrap { display: flex; align-items: center; border: 1px solid rgba(255,255,255,.33); border-radius: 10px; overflow: hidden; background: #fff; }
.career-studio .cs-support-input-wrap span { display: grid; place-items: center; width: 42px; align-self: stretch; color: #2b2516; background: #eee7d4; font-weight: 900; }
.career-studio .cs-support-input-wrap input { width: 100%; min-height: 48px; padding: 0 12px; border: 0; color: #16130c; background: #fff; font: inherit; font-weight: 750; }
.career-studio .cs-support-input-wrap input:focus { outline: 3px solid rgba(230,196,94,.65); outline-offset: -3px; }
.career-studio .cs-support-help { margin: 9px 0 14px; font-size: .76rem; }
.career-studio .cs-support-button { width: 100%; justify-content: center; border: 0; color: #17130b; background: #e6c45e; }
.career-studio .cs-support-button:hover, .career-studio .cs-support-button:focus-visible { color: #17130b; background: #f1d778; }
.career-studio .cs-support-button[disabled] { cursor: not-allowed; opacity: .64; }
.career-studio .cs-support-status { min-height: 19px; margin: 11px 0 0; font-size: .78rem; line-height: 1.45; }
.career-studio .cs-support-status.is-error { color: #ffc1b8; }
.career-studio .cs-support-status.is-success { color: #dff1c7; }
.career-studio .cs-support-modal[hidden] { display: none; }
.career-studio .cs-support-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 22px; }
.career-studio .cs-support-modal-backdrop { position: absolute; inset: 0; background: rgba(13, 12, 9, .72); backdrop-filter: blur(4px); }
.career-studio .cs-support-modal-card { position: relative; z-index: 1; width: min(100%, 480px); padding: 38px 32px 30px; border: 1px solid rgba(230,196,94,.65); border-radius: 22px; color: #fdfbf5; background: #1c1a13; box-shadow: 0 28px 80px rgba(0,0,0,.45); text-align: center; }
.career-studio .cs-support-modal-card h2 { margin: 9px 0 12px; color: #fff; font-size: 1.85rem; line-height: 1.12; }
.career-studio .cs-support-modal-card p { color: rgba(255,255,255,.78); }
.career-studio .cs-support-modal-card .cs-button { margin-top: 16px; }
.career-studio .cs-support-success-mark { display: grid; place-items: center; width: 62px; height: 62px; margin: 0 auto 20px; border: 1px solid #e6c45e; border-radius: 50%; color: #1c1a13; background: #e6c45e; font-size: 1.7rem; font-weight: 950; }
.career-studio .cs-support-modal-close { position: absolute; top: 12px; right: 14px; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; color: #fff; background: transparent; font-size: 1.25rem; cursor: pointer; }
.career-studio .cs-support-modal-close:hover, .career-studio .cs-support-modal-close:focus-visible { border-color: #e6c45e; color: #e6c45e; outline: none; }
@media (max-width: 760px) {
  .career-studio .cs-support-section { grid-template-columns: 1fr; padding: 24px 18px; }
  .career-studio .cs-support-amounts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* Career Studio v8 — premium builder, polished export controls and indexable guide */
.career-studio {
    background:
        radial-gradient(circle at 5% 0%, rgba(229, 205, 117, .16), transparent 24rem),
        radial-gradient(circle at 96% 26%, rgba(30, 29, 19, .055), transparent 25rem),
        var(--cs-paper);
}
.career-studio .cs-shell { width: min(1240px, calc(100% - 40px)); }
.career-studio .cs-hero { position: relative; padding: 56px 0 32px; }
.career-studio .cs-hero-main { position: relative; z-index: 1; }
.career-studio .cs-hero::after { content: ''; position: absolute; top: 31px; right: 315px; width: 220px; height: 150px; opacity: .45; pointer-events: none; background: linear-gradient(135deg, transparent 0 45%, rgba(189,141,0,.1) 45% 46%, transparent 46% 58%, rgba(189,141,0,.08) 58% 59%, transparent 59%); }
.career-studio .cs-hero-points span { border-color: #d7c283; background: rgba(255,253,248,.88); }
.career-studio .cs-premium-value-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; overflow: hidden; margin: 0 0 24px; border: 1px solid #ddd1b3; border-radius: 16px; background: #ddd1b3; box-shadow: 0 12px 28px rgba(48,39,19,.045); }
.career-studio .cs-premium-value-strip > div { padding: 16px 18px; background: rgba(255,253,248,.92); }
.career-studio .cs-premium-value-strip strong { display: block; margin-bottom: 4px; color: #211d14; font-size: .88rem; }
.career-studio .cs-premium-value-strip span { display: block; color: var(--cs-muted); font-size: .78rem; line-height: 1.4; }
.career-studio .cs-grid { gap: 26px; }
.career-studio .cs-insights { position: sticky; top: 18px; display: grid; gap: 16px; }
.career-studio .cs-preview-card { border-color: #d5c39a; box-shadow: 0 18px 42px rgba(44,35,13,.1); }
.career-studio .cs-builder-toolbar { align-items: flex-start; border-color: #d7c593; background: linear-gradient(130deg, #fffdf8, #f8f0da); }
.career-studio .cs-export-note { max-width: 240px; }
.career-studio .cs-template-picker { display: grid; grid-template-columns: 215px minmax(0,1fr); gap: 18px; align-items: center; margin: -4px 0 25px; padding: 17px; border: 1px solid #ded3bc; border-radius: 15px; background: linear-gradient(135deg, #fdfbf6, #f7f0de); }
.career-studio .cs-template-picker-copy p { margin-bottom: 4px; }
.career-studio .cs-template-picker-copy strong { display: block; font-size: .98rem; }
.career-studio .cs-template-picker-copy > p:last-child { margin: 5px 0 0; color: var(--cs-muted); font-size: .78rem; line-height: 1.42; }
.career-studio .cs-template-options { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.career-studio .cs-template-option { display: grid; grid-template-columns: 42px 1fr; gap: 9px; align-items: center; padding: 10px; border: 1px solid #d7cbb1; border-radius: 11px; color: #403b30; background: rgba(255,255,255,.75); text-align: left; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.career-studio .cs-template-option:hover { transform: translateY(-2px); border-color: #b59227; }
.career-studio .cs-template-option.is-active { border-color: #1d1a15; box-shadow: 0 7px 16px rgba(29,26,21,.1); background: #fffefa; }
.career-studio .cs-template-option strong { display: block; font-size: .78rem; }
.career-studio .cs-template-option small { display: block; margin-top: 3px; color: var(--cs-muted); font-size: .67rem; font-weight: 650; line-height: 1.3; }
.career-studio .cs-template-swatch { display: block; width: 40px; height: 50px; overflow: hidden; border: 1px solid #bfb7a7; border-radius: 5px; background: #fff; }
.career-studio .cs-template-swatch-classic { background: linear-gradient(#24211c 0 17%, #fff 17% 100%); }
.career-studio .cs-template-swatch-executive { background: linear-gradient(#191814 0 24%, #eee5ce 24% 100%); }
.career-studio .cs-template-swatch-modern { background: linear-gradient(90deg, #c69a24 0 8%, #fff 8% 100%); }
.career-studio[data-resume-template="classic"] .cs-resume-preview { border-radius: 3px; }
.career-studio[data-resume-template="classic"] .cs-resume-header { border-bottom-color: #111; }
.career-studio[data-resume-template="modern"] .cs-resume-preview { border-top: 6px solid #b58a13; }
.career-studio[data-resume-template="modern"] .cs-resume-header { border-bottom-color: #b58a13; }
.career-studio[data-resume-template="modern"] .cs-resume-section h4 { color: #725600; border-bottom-color: #d4bd73; }
.career-studio .cs-search-guide { margin-top: 42px; padding: clamp(24px, 4vw, 46px); border: 1px solid #d9cfbc; border-radius: 22px; background: #fffdf8; box-shadow: var(--cs-shadow); }
.career-studio .cs-search-guide-intro { max-width: 820px; }
.career-studio .cs-search-guide-intro h2 { max-width: 760px; }
.career-studio .cs-search-guide-intro > p:last-child { margin-bottom: 0; color: var(--cs-muted); font-size: 1rem; line-height: 1.66; }
.career-studio .cs-search-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; margin-top: 28px; }
.career-studio .cs-search-guide-grid article { min-height: 170px; padding: 18px; border: 1px solid #e0d7c7; border-radius: 14px; background: linear-gradient(150deg, #fffefa, #f9f4e8); }
.career-studio .cs-search-guide-grid span { display: grid; place-items: center; width: 29px; height: 29px; margin-bottom: 15px; border-radius: 50%; color: #694e00; background: #f0dfab; font-size: .72rem; font-weight: 900; }
.career-studio .cs-search-guide-grid h3 { margin-bottom: 7px; font-size: 1rem; }
.career-studio .cs-search-guide-grid p { margin: 0; color: var(--cs-muted); font-size: .86rem; line-height: 1.52; }
.career-studio .cs-role-guide { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 28px; align-items: start; margin-top: 20px; padding: 22px; border-radius: 15px; color: #f4f0e6; background: #191813; }
.career-studio .cs-role-guide .cs-eyebrow { color: #e4be55; }
.career-studio .cs-role-guide h3 { margin: 0; color: #fffdf6; font-size: 1.35rem; line-height: 1.18; }
.career-studio .cs-role-guide ul { display: grid; gap: 9px; padding: 0; margin: 0; list-style: none; }
.career-studio .cs-role-guide li { position: relative; padding-left: 17px; color: #ddd6c8; font-size: .86rem; line-height: 1.45; }
.career-studio .cs-role-guide li::before { content: '•'; position: absolute; left: 0; color: #e7be48; }
.career-studio .cs-faq { display: grid; gap: 9px; margin-top: 24px; }
.career-studio .cs-faq details { padding: 0 16px; border: 1px solid #e0d7c8; border-radius: 11px; background: #fffefa; }
.career-studio .cs-faq summary { padding: 15px 27px 15px 0; color: #252119; cursor: pointer; font-size: .91rem; font-weight: 830; }
.career-studio .cs-faq p { margin: 0 0 15px; color: var(--cs-muted); font-size: .87rem; line-height: 1.55; }
.career-studio .cs-search-links { display: flex; gap: 9px; flex-wrap: wrap; margin-top: 22px; }
.career-studio .cs-search-links a { display: inline-flex; padding: 9px 11px; border: 1px solid #d8c587; border-radius: 999px; color: #5c4300; background: #fff9e8; font-size: .8rem; font-weight: 800; text-decoration: none; }
.career-studio .cs-search-links a:hover { color: #1c1a16; border-color: #1c1a16; }

/* The v8 animations deliberately travel across the arena before impact. */
.career-studio .cs-game-arena.is-candidate-win .cs-fighter--candidate { animation: cs-v8-candidate-run-kick 1.72s cubic-bezier(.19,.73,.2,1) both !important; }
.career-studio .cs-game-arena.is-candidate-win .cs-candidate-kick-leg { animation: cs-v8-candidate-leg 1.72s ease-in-out both !important; }
.career-studio .cs-game-arena.is-candidate-win .cs-fighter--recruiter { animation: cs-v8-recruiter-hit 1.72s cubic-bezier(.24,.84,.24,1) both !important; }
.career-studio .cs-game-arena.is-recruiter-win .cs-fighter--recruiter { animation: cs-v8-recruiter-run-kick 1.72s cubic-bezier(.19,.73,.2,1) both !important; }
.career-studio .cs-game-arena.is-recruiter-win .cs-recruiter-kick-leg { animation: cs-v8-recruiter-leg 1.72s ease-in-out both !important; }
.career-studio .cs-game-arena.is-recruiter-win .cs-fighter--candidate { animation: cs-v8-candidate-hit 1.72s cubic-bezier(.24,.84,.24,1) both !important; }
@keyframes cs-v8-candidate-run-kick { 0% { transform: translateX(0) scaleX(1); } 28% { transform: translateX(clamp(75px, 11vw, 145px)) scaleX(1.03); } 53% { transform: translateX(clamp(155px, 25vw, 340px)) translateY(-30px) rotate(-10deg) scaleX(1.05); } 65% { transform: translateX(clamp(180px, 28vw, 370px)) translateY(-12px) rotate(-4deg); } 100% { transform: translateX(0) scaleX(1); } }
@keyframes cs-v8-candidate-leg { 0%, 38%, 100% { transform: rotate(0deg); } 54%, 63% { transform: rotate(-58deg) translate(7px, -12px); } 72% { transform: rotate(-20deg); } }
@keyframes cs-v8-recruiter-hit { 0%, 50% { transform: translateX(0) rotate(0); } 60% { transform: translateX(clamp(25px, 4vw, 55px)) rotate(11deg); } 73% { transform: translateX(clamp(55px, 8vw, 100px)) rotate(18deg) translateY(8px); } 100% { transform: translateX(0) rotate(0); } }
@keyframes cs-v8-recruiter-run-kick { 0% { transform: translateX(0) scaleX(1); } 28% { transform: translateX(clamp(-75px, -11vw, -145px)) scaleX(1.03); } 53% { transform: translateX(clamp(-155px, -25vw, -340px)) translateY(-30px) rotate(10deg) scaleX(1.05); } 65% { transform: translateX(clamp(-180px, -28vw, -370px)) translateY(-12px) rotate(4deg); } 100% { transform: translateX(0) scaleX(1); } }
@keyframes cs-v8-recruiter-leg { 0%, 38%, 100% { transform: rotate(0deg); } 54%, 63% { transform: rotate(58deg) translate(-7px, -12px); } 72% { transform: rotate(20deg); } }
@keyframes cs-v8-candidate-hit { 0%, 50% { transform: translateX(0) rotate(0); } 60% { transform: translateX(clamp(-25px, -4vw, -55px)) rotate(-11deg); } 73% { transform: translateX(clamp(-55px, -8vw, -100px)) rotate(-18deg) translateY(8px); } 100% { transform: translateX(0) rotate(0); } }

@media (max-width: 1080px) { .career-studio .cs-insights { position: static; } }
@media (max-width: 780px) {
    .career-studio .cs-premium-value-strip, .career-studio .cs-search-guide-grid, .career-studio .cs-role-guide, .career-studio .cs-template-picker { grid-template-columns: 1fr; }
    .career-studio .cs-template-options { grid-template-columns: 1fr; }
    .career-studio .cs-search-guide { margin-top: 28px; padding: 23px 18px; }
    .career-studio .cs-role-guide { gap: 18px; padding: 19px; }
    .career-studio .cs-game-arena.is-candidate-win .cs-fighter--candidate { animation-name: cs-v8-candidate-run-kick-mobile !important; }
    .career-studio .cs-game-arena.is-recruiter-win .cs-fighter--recruiter { animation-name: cs-v8-recruiter-run-kick-mobile !important; }
}
@keyframes cs-v8-candidate-run-kick-mobile { 0% { transform: translateX(0); } 55% { transform: translateX(clamp(95px, 34vw, 180px)) translateY(-22px) rotate(-9deg); } 100% { transform: translateX(0); } }
@keyframes cs-v8-recruiter-run-kick-mobile { 0% { transform: translateX(0); } 55% { transform: translateX(clamp(-95px, -34vw, -180px)) translateY(-22px) rotate(9deg); } 100% { transform: translateX(0); } }

/* CAREER STUDIO EXPORT LIGHT SURFACE V13 FIX */
html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface {
    background: linear-gradient(135deg, #fffdf7 0%, #fbf6e8 100%) !important;
    border: 1px solid #ded1a9 !important;
    color: #171714 !important;
    box-shadow: 0 16px 35px rgba(45, 36, 12, .09) !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface :is(
    h1, h2, h3, h4, h5, h6, p, span, strong, small, label, li, div
) {
    color: #171714 !important;
    text-shadow: none !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface input,
html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface select,
html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface textarea {
    background: #ffffff !important;
    color: #171714 !important;
    border-color: #d9cfb8 !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface .cs-export-primary {
    background: #171714 !important;
    border-color: #171714 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(23, 23, 20, .18) !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface .cs-export-primary * {
    color: #ffffff !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface .cs-export-secondary {
    background: #fffdf7 !important;
    border: 1px solid #b99a22 !important;
    color: #705600 !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface .cs-export-secondary * {
    color: #705600 !important;
}

html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface button:not(.cs-export-primary):not(.cs-export-secondary),
html body .cs-export-light-surface.cs-export-light-surface.cs-export-light-surface a:not(.cs-export-primary):not(.cs-export-secondary) {
    background: #fffdf7 !important;
    color: #171714 !important;
    border-color: #d5c79e !important;
}

/* ===== career-studio-launch-v9.css ===== */

/* Career Studio v9 — launch-quality interaction, guidance and responsive polish. */
.career-studio .cs-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:22px; }
.career-studio .cs-hero-trust { flex:0 0 100%; color:var(--cs-muted); font-size:.78rem; font-weight:700; }
.career-studio .cs-launch-workflow { display:grid; grid-template-columns:250px minmax(0,1fr); gap:22px; align-items:center; margin:0 0 24px; padding:18px 20px; border:1px solid #ded4bf; border-radius:16px; background:#fffdf8; box-shadow:0 10px 24px rgba(38,32,20,.04); }
.career-studio .cs-launch-workflow-title strong { display:block; margin-top:4px; color:#211e18; font-size:1.03rem; line-height:1.35; }
.career-studio .cs-launch-workflow ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; padding:0; margin:0; list-style:none; }
.career-studio .cs-launch-workflow li { display:flex; gap:9px; align-items:flex-start; min-width:0; }
.career-studio .cs-launch-workflow li > span { display:grid; flex:0 0 auto; place-items:center; width:27px; height:27px; border:1px solid #cfb662; border-radius:50%; color:#5b4509; background:#fff7d8; font-size:.72rem; font-weight:950; }
.career-studio .cs-launch-workflow strong, .career-studio .cs-launch-workflow small { display:block; }
.career-studio .cs-launch-workflow strong { color:#241f16; font-size:.76rem; }
.career-studio .cs-launch-workflow small { margin-top:4px; color:var(--cs-muted); font-size:.68rem; line-height:1.42; }
.career-studio .cs-start-path { display:grid; grid-template-columns:240px minmax(0,1fr); gap:18px; margin:0 0 18px; padding:16px; border:1px solid #ded3bc; border-radius:15px; background:linear-gradient(135deg,#fffdf8,#f5edda); }
.career-studio .cs-start-path p { margin:0; }
.career-studio .cs-start-path strong { display:block; margin:4px 0 6px; color:#25211a; font-size:.97rem; }
.career-studio .cs-start-path #csPathGuide { color:var(--cs-muted); font-size:.76rem; line-height:1.46; }
.career-studio .cs-start-path-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.career-studio .cs-start-path-option { min-height:84px; padding:12px; border:1px solid #d8cdb6; border-radius:11px; color:#332d23; background:rgba(255,255,255,.78); text-align:left; transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease; cursor:pointer; }
.career-studio .cs-start-path-option:hover, .career-studio .cs-start-path-option:focus-visible, .career-studio .cs-start-path-option.is-active { border-color:#aa8215; background:#fffdf7; box-shadow:0 8px 18px rgba(46,36,13,.1); outline:none; transform:translateY(-1px); }
.career-studio .cs-start-path-option strong, .career-studio .cs-start-path-option small { display:block; }
.career-studio .cs-start-path-option strong { font-size:.78rem; }
.career-studio .cs-start-path-option small { margin-top:5px; color:var(--cs-muted); font-size:.67rem; line-height:1.38; }
.career-studio .cs-export-detail { grid-column:1/-1; margin:2px 0 0; color:#685d4b; font-size:.72rem; line-height:1.45; }
.career-studio .cs-quality-coach { border-color:#d7c071; background:linear-gradient(135deg,#fffdf4,#fff8e0); }
.career-studio .cs-quality-coach-copy { margin:0 0 10px; color:#655c4d; font-size:.75rem; line-height:1.45; }
.career-studio .cs-quality-list { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.career-studio .cs-quality-list li { display:flex; gap:8px; align-items:flex-start; color:#5a5141; font-size:.72rem; line-height:1.37; }
.career-studio .cs-quality-list .cs-quality-mark { display:grid; flex:0 0 auto; place-items:center; width:17px; height:17px; margin-top:1px; border-radius:50%; font-size:.65rem; font-weight:950; }
.career-studio .cs-quality-list .is-done .cs-quality-mark { color:#0b613c; background:#d9f1e4; }
.career-studio .cs-quality-list .is-next .cs-quality-mark { color:#7a4808; background:#fde7bd; }
.career-studio .cs-search-guide-disclaimer { max-width:880px; padding:12px 14px; border-left:3px solid #b98916; color:#5a5143; background:#fffaeb; font-size:.88rem; line-height:1.55; }
.career-studio .cs-crawl-note { margin:13px 0 0; color:#797165; font-size:.72rem; text-align:center; }
.career-studio .cs-crawl-note a { color:#7d5a08; font-weight:800; }
.career-studio .cs-exporting { cursor:wait !important; opacity:.72; }
@media (max-width:1000px) { .career-studio .cs-launch-workflow { grid-template-columns:1fr; } .career-studio .cs-launch-workflow ol { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:780px) { .career-studio .cs-start-path { grid-template-columns:1fr; } .career-studio .cs-start-path-options { grid-template-columns:1fr; } .career-studio .cs-launch-workflow ol { grid-template-columns:1fr; } .career-studio .cs-hero-actions .cs-button { width:100%; justify-content:center; } }


/* ===== career-studio-dark-v10.css ===== */
/*
| GraphicBidu Career Studio — Dark Theme & Import UX v10
| Loaded after the existing Career Studio styles.
| Handles the platform dark-mode variants without changing the global theme.
*/

/* Supports the common GraphicBidu / browser theme markers. */
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio {
    --cs-ink: #f5f3eb;
    --cs-paper: #0d0f0e;
    --cs-panel: #171a17;
    --cs-muted: #b6baaf;
    --cs-line: #30362f;
    --cs-warm: #e7c74f;
    --cs-warm-dark: #f0d978;
    --cs-success: #67c78d;
    --cs-danger: #ef9183;
    --cs-shadow: 0 20px 45px rgba(0, 0, 0, .34);
    color: var(--cs-ink);
    background: var(--cs-paper);
}

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-local-bar,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-progress-wrap,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-panel,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-insight-card,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-preview-card,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-builder-toolbar,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-repeat-card,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-photo-row,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-review-item,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-job-result,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-job-result-block,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-start-path,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-template-picker,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-premium-value-strip,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-launch-workflow,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-search-guide,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-role-guide,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-faq details {
    background: var(--cs-panel) !important;
    color: var(--cs-ink) !important;
    border-color: var(--cs-line) !important;
}

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio label,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-panel-heading > div > p:last-child,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-local-copy p,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-local-note,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-crawl-note,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-photo-copy p,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-section-title p,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-insight-list li,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-job-match-content,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-review-item p,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-game-feedback,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-export-note,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-export-detail {
    color: var(--cs-muted) !important;
}

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio input,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio textarea,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio select,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-answer-button {
    color: var(--cs-ink) !important;
    background: #111512 !important;
    border-color: #3a4239 !important;
}

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio input::placeholder,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio textarea::placeholder { color: #8e968a !important; }

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-button-secondary,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-button-quiet,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-start-path-option,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-template-option,
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-suggestion-button {
    color: #f1d66e !important;
    background: #171a17 !important;
    border-color: #615833 !important;
}

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-button-primary {
    color: #15150f !important;
    background: #e7c74f !important;
    border-color: #e7c74f !important;
}

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-score-ring::after { background: var(--cs-panel) !important; }
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-truth-insight { background: #292414 !important; border-color: #71622a !important; }
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-game-card { background: linear-gradient(145deg, #292611, #211f12) !important; border-color: #756828 !important; }
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-resume-preview { background: #fff !important; }

/* Import card is intentionally distinct: it makes the upgrade path obvious without appearing as a paid gate. */
.career-studio .cs-import-resume {
    margin: 0 0 24px;
    padding: clamp(16px, 2.2vw, 22px);
    border: 1px solid #d8c690;
    border-radius: 16px;
    background: linear-gradient(135deg, #fffaf0, #f7f1df);
}
.career-studio .cs-import-resume-grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; }
.career-studio .cs-import-resume h3 { margin: 0 0 7px; font-size: 1.05rem; }
.career-studio .cs-import-resume p { margin: 0; color: var(--cs-muted); font-size: .86rem; line-height: 1.52; }
.career-studio .cs-import-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; flex-wrap: wrap; }
.career-studio .cs-import-file-name { display: block; min-height: 20px; margin-top: 10px; color: #61531d; font-size: .82rem; font-weight: 780; }
.career-studio .cs-import-options { display: flex; align-items: center; gap: 8px; margin-top: 12px; color: var(--cs-muted); font-size: .79rem; }
.career-studio .cs-import-options input { width: auto; }
.career-studio .cs-import-status { min-height: 20px; margin-top: 11px !important; font-size: .82rem !important; font-weight: 700; }
.career-studio .cs-import-status.is-good { color: #287349 !important; }
.career-studio .cs-import-status.is-error { color: #9a4033 !important; }
.career-studio .cs-import-status.is-loading { color: #7b5c08 !important; }

:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-import-resume {
    background: linear-gradient(135deg, #211f13, #171912) !important;
    border-color: #6b612e !important;
}
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-import-file-name { color: #f0d878 !important; }
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-import-status.is-good { color: #8de3ad !important; }
:is(html[data-theme="dark"], body[data-theme="dark"], html.dark, body.dark, html.theme-dark, body.theme-dark, body.dark-mode, .dark-theme, [data-theme="dark"]) .career-studio .cs-import-status.is-error { color: #ffafa2 !important; }

@media (max-width: 760px) {
    .career-studio .cs-import-resume-grid { grid-template-columns: 1fr; }
    .career-studio .cs-import-actions { justify-content: flex-start; }
}


/* ===== career-studio-ui-repair-v12.css ===== */
/*
| GraphicBidu Career Studio — v12 UI Repair + Theme Contract
| This file intentionally does NOT move existing HTML. It fixes the v11 layout
| regression and uses one explicit .cs-light-ui / .cs-dark-ui contract.
*/

/* --------------------------------------------------------------------------
   Clean light-theme contract. It deliberately wins over older broad dark rules.
   -------------------------------------------------------------------------- */
.career-studio.cs-light-ui {
    --cs-ink: #181713;
    --cs-paper: #f6f3ea;
    --cs-panel: #fffdf8;
    --cs-muted: #675f52;
    --cs-line: #ded6c8;
    --cs-warm: #d8ad20;
    --cs-warm-dark: #76570a;
    --cs-success: #258454;
    --cs-danger: #b34f42;
    --cs-shadow: 0 18px 42px rgba(49, 39, 19, .08);
    color: var(--cs-ink);
    background: #f6f3ea !important;
}
.career-studio.cs-light-ui .cs-panel,
.career-studio.cs-light-ui .cs-local-bar,
.career-studio.cs-light-ui .cs-progress-wrap,
.career-studio.cs-light-ui .cs-insight-card,
.career-studio.cs-light-ui .cs-preview-card,
.career-studio.cs-light-ui .cs-repeat-card,
.career-studio.cs-light-ui .cs-photo-row,
.career-studio.cs-light-ui .cs-review-item,
.career-studio.cs-light-ui .cs-job-result,
.career-studio.cs-light-ui .cs-job-result-block,
.career-studio.cs-light-ui .cs-quality-coach,
.career-studio.cs-light-ui .cs-search-guide,
.career-studio.cs-light-ui .cs-role-guide,
.career-studio.cs-light-ui .cs-faq details,
.career-studio.cs-light-ui .cs-support-section,
.career-studio.cs-light-ui .cs-support-box,
.career-studio.cs-light-ui .cs-form-section {
    color: #181713 !important;
    background: #fffdf8 !important;
    border-color: #ded6c8 !important;
}
.career-studio.cs-light-ui :is(h1,h2,h3,h4,strong,label,.cs-section-title h3,.cs-panel-heading h2,.cs-local-pill,.cs-fighter-label) { color: #181713 !important; }
.career-studio.cs-light-ui :is(p,li,small,.cs-local-note,.cs-local-copy p,.cs-panel-heading > div > p:last-child,.cs-photo-copy p,.cs-section-title p,.cs-insight-list li,.cs-job-match-content,.cs-review-item p,.cs-game-feedback,.cs-export-note,.cs-export-detail,.cs-crawl-note,.cs-form-note,.cs-search-guide-disclaimer) { color: #675f52 !important; }
.career-studio.cs-light-ui :is(input,textarea,select,.cs-answer-button,.cs-support-input-wrap input) {
    color: #181713 !important;
    background: #fffefb !important;
    border-color: #d8d0c2 !important;
}
.career-studio.cs-light-ui :is(input,textarea)::placeholder { color: #8b8374 !important; }
.career-studio.cs-light-ui .cs-resume-preview { color: #171717 !important; background: #fff !important; }
.career-studio.cs-light-ui .cs-resume-preview :is(.resume-name,.resume-section-title) { color: #171717 !important; }
.career-studio.cs-light-ui .cs-resume-preview :is(.resume-copy,.resume-meta,.resume-skill) { color: #3d3d3d !important; }

/* --------------------------------------------------------------------------
   Builder launchpad, using the existing static V9/V10 markup.
   -------------------------------------------------------------------------- */
.career-studio .cs-builder-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px 20px;
    align-items: center;
    margin: 0 0 16px;
    padding: 18px 20px;
    border: 1px solid #d7c36f;
    border-radius: 18px;
    color: #f8f5e9;
    background: linear-gradient(135deg, #17160f 0%, #292410 100%);
    box-shadow: 0 18px 34px rgba(30, 24, 8, .14);
}
.career-studio .cs-builder-toolbar > div:first-child::before {
    content: 'EXPORT YOUR RESUME';
    display: block;
    margin-bottom: 5px;
    color: #e9cf69;
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .12em;
}
.career-studio .cs-builder-toolbar .cs-toolbar-label { color: #e9cf69 !important; }
.career-studio .cs-builder-toolbar strong { color: #fffdf5 !important; }
.career-studio .cs-builder-toolbar p { color: #d8d1bd !important; }
.career-studio .cs-builder-toolbar .cs-toolbar-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.career-studio .cs-builder-toolbar .cs-export-note,
.career-studio .cs-builder-toolbar .cs-export-detail {
    grid-column: 1 / -1;
    margin: -1px 0 0;
    padding-top: 12px;
    border-top: 1px solid rgba(255,255,255,.14);
    color: #d2ccba !important;
    font-size: .77rem;
}
.career-studio .cs-builder-toolbar .cs-export-detail { padding-top: 0; border-top: 0; color: #bdb5a1 !important; }
.career-studio .cs-builder-toolbar .cs-export-detail strong { color: #f0d579 !important; }
.career-studio .cs-builder-toolbar .cs-button-primary { color: #201b07 !important; background: #ebd36f !important; border-color: #ebd36f !important; }
.career-studio .cs-builder-toolbar .cs-button-secondary { color: #fff7d6 !important; background: rgba(255,255,255,.06) !important; border-color: rgba(242,219,132,.58) !important; }

.career-studio .cs-import-resume {
    position: relative;
    overflow: hidden;
    margin: 0 0 16px;
    padding: 22px 24px;
    border: 1px solid #d8bd5a;
    border-radius: 18px;
    color: #1d1a12;
    background:
        radial-gradient(circle at 94% 10%, rgba(235, 204, 84, .26), transparent 28%),
        linear-gradient(135deg, #fffdf6, #f7efdc);
    box-shadow: 0 14px 28px rgba(61, 45, 8, .07);
}
.career-studio .cs-import-resume::after {
    content: '01';
    position: absolute;
    top: 9px;
    right: 18px;
    color: rgba(126, 97, 12, .12);
    font-size: 3.1rem;
    font-weight: 950;
    line-height: 1;
    pointer-events: none;
}
.career-studio .cs-import-resume-grid { position: relative; z-index: 1; }
.career-studio .cs-import-resume h3 { margin: 4px 0 7px !important; font-size: clamp(1.12rem, 1.7vw, 1.38rem) !important; }
.career-studio .cs-import-resume p { max-width: 690px; }
.career-studio .cs-import-resume .cs-import-actions { gap: 10px; }
.career-studio .cs-import-file-name { font-weight: 800; }

.career-studio .cs-start-path,
.career-studio .cs-template-picker {
    display: block !important;
    margin: 0 0 16px !important;
    padding: 20px !important;
    border: 1px solid #ddd5c5 !important;
    border-radius: 18px !important;
    color: #191713 !important;
    background: #fffdf8 !important;
    box-shadow: 0 12px 25px rgba(41, 35, 21, .045) !important;
}
.career-studio .cs-start-path > div:first-child,
.career-studio .cs-template-picker > div:first-child { margin-bottom: 14px; }
.career-studio .cs-start-path .cs-toolbar-label,
.career-studio .cs-template-picker .cs-toolbar-label { color: #8a6a13 !important; }
.career-studio .cs-start-path > div:first-child > strong,
.career-studio .cs-template-picker > div:first-child > strong { display: block; margin: 3px 0 6px; font-size: 1.05rem !important; }
.career-studio .cs-start-path #csPathGuide,
.career-studio .cs-template-picker p { max-width: 750px; color: #675f52 !important; }
.career-studio .cs-start-path-options,
.career-studio .cs-template-options {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 11px !important;
}
.career-studio .cs-start-path-option,
.career-studio .cs-template-option {
    min-width: 0;
    min-height: 112px !important;
    padding: 15px !important;
    border: 1px solid #ddd3bc !important;
    border-radius: 14px !important;
    color: #241f16 !important;
    background: linear-gradient(180deg, #fffefb, #faf7ef) !important;
    text-align: left;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.career-studio .cs-start-path-option:hover,
.career-studio .cs-start-path-option:focus-visible,
.career-studio .cs-template-option:hover,
.career-studio .cs-template-option:focus-visible {
    border-color: #be9a30 !important;
    background: #fffdf7 !important;
    box-shadow: 0 10px 20px rgba(58, 43, 8, .08) !important;
    outline: none;
    transform: translateY(-2px);
}
.career-studio .cs-start-path-option.is-active,
.career-studio .cs-template-option.is-active {
    border-color: #a78012 !important;
    background: linear-gradient(135deg, #fff7d9, #fffdf5) !important;
    box-shadow: inset 0 0 0 1px rgba(167,128,18,.22), 0 10px 21px rgba(80,61,11,.08) !important;
}
.career-studio .cs-start-path-option strong,
.career-studio .cs-template-option strong { color: #201b13 !important; font-size: .9rem !important; }
.career-studio .cs-start-path-option small,
.career-studio .cs-template-option small { color: #675f52 !important; font-size: .76rem !important; line-height: 1.42 !important; }
.career-studio .cs-template-option { display: grid !important; grid-template-columns: 38px minmax(0,1fr); align-items: center; gap: 10px; }
.career-studio .cs-template-swatch { width: 34px !important; height: 46px !important; border-radius: 7px !important; }

/* --------------------------------------------------------------------------
   Explicit dark contract. These rules exist only when v12 JS sets cs-dark-ui.
   -------------------------------------------------------------------------- */
.career-studio.cs-dark-ui {
    --cs-ink: #f7f5ec;
    --cs-paper: #0c100e;
    --cs-panel: #151b17;
    --cs-muted: #b7c0b7;
    --cs-line: #334239;
    --cs-warm: #e5c757;
    --cs-warm-dark: #f0d77c;
    --cs-success: #78d29a;
    --cs-danger: #ff9f91;
    --cs-shadow: 0 22px 48px rgba(0,0,0,.46);
    color: var(--cs-ink);
    background: linear-gradient(180deg, #0a0e0c, #111712 48%, #0a0e0c) !important;
}
.career-studio.cs-dark-ui .cs-panel,
.career-studio.cs-dark-ui .cs-local-bar,
.career-studio.cs-dark-ui .cs-progress-wrap,
.career-studio.cs-dark-ui .cs-insight-card,
.career-studio.cs-dark-ui .cs-preview-card,
.career-studio.cs-dark-ui .cs-repeat-card,
.career-studio.cs-dark-ui .cs-photo-row,
.career-studio.cs-dark-ui .cs-review-item,
.career-studio.cs-dark-ui .cs-job-result,
.career-studio.cs-dark-ui .cs-job-result-block,
.career-studio.cs-dark-ui .cs-quality-coach,
.career-studio.cs-dark-ui .cs-search-guide,
.career-studio.cs-dark-ui .cs-role-guide,
.career-studio.cs-dark-ui .cs-faq details,
.career-studio.cs-dark-ui .cs-support-section,
.career-studio.cs-dark-ui .cs-support-box,
.career-studio.cs-dark-ui .cs-form-section {
    color: #f7f5ec !important;
    background: #151b17 !important;
    border-color: #334239 !important;
}
.career-studio.cs-dark-ui :is(h1,h2,h3,h4,strong,label,.cs-section-title h3,.cs-panel-heading h2,.cs-local-pill,.cs-fighter-label) { color: #f7f5ec !important; }
.career-studio.cs-dark-ui :is(p,li,small,.cs-local-note,.cs-local-copy p,.cs-panel-heading > div > p:last-child,.cs-photo-copy p,.cs-section-title p,.cs-insight-list li,.cs-job-match-content,.cs-review-item p,.cs-game-feedback,.cs-export-note,.cs-export-detail,.cs-crawl-note,.cs-form-note,.cs-search-guide-disclaimer) { color: #b7c0b7 !important; }
.career-studio.cs-dark-ui :is(input,textarea,select,.cs-answer-button,.cs-support-input-wrap input) { color: #f7f5ec !important; background: #0c120e !important; border-color: #3d4e43 !important; }
.career-studio.cs-dark-ui :is(input,textarea)::placeholder { color: #889589 !important; }
.career-studio.cs-dark-ui select { color-scheme: dark; }
.career-studio.cs-dark-ui select option { color: #f7f5ec; background: #101611; }
.career-studio.cs-dark-ui .cs-import-resume {
    color: #f7f5ec !important;
    border-color: #796c31 !important;
    background: radial-gradient(circle at 92% 12%, rgba(230, 196, 75, .13), transparent 31%), linear-gradient(135deg, #231f11, #151c17) !important;
}
.career-studio.cs-dark-ui .cs-import-resume::after { color: rgba(244,215,110,.09); }
.career-studio.cs-dark-ui .cs-import-resume p,
.career-studio.cs-dark-ui .cs-import-resume .cs-import-options { color: #c3ccc2 !important; }
.career-studio.cs-dark-ui .cs-start-path,
.career-studio.cs-dark-ui .cs-template-picker {
    color: #f7f5ec !important;
    background: #151b17 !important;
    border-color: #34433a !important;
}
.career-studio.cs-dark-ui .cs-start-path #csPathGuide,
.career-studio.cs-dark-ui .cs-template-picker p { color: #b7c0b7 !important; }
.career-studio.cs-dark-ui .cs-start-path-option,
.career-studio.cs-dark-ui .cs-template-option {
    color: #f7f5ec !important;
    border-color: #3c4b41 !important;
    background: linear-gradient(180deg, #1b241e, #141b16) !important;
}
.career-studio.cs-dark-ui .cs-start-path-option strong,
.career-studio.cs-dark-ui .cs-template-option strong { color: #f7f5ec !important; }
.career-studio.cs-dark-ui .cs-start-path-option small,
.career-studio.cs-dark-ui .cs-template-option small { color: #b7c0b7 !important; }
.career-studio.cs-dark-ui .cs-start-path-option.is-active,
.career-studio.cs-dark-ui .cs-template-option.is-active {
    color: #181509 !important;
    border-color: #ead16a !important;
    background: linear-gradient(135deg, #ead16a, #f5df8d) !important;
}
.career-studio.cs-dark-ui .cs-start-path-option.is-active strong,
.career-studio.cs-dark-ui .cs-template-option.is-active strong { color: #181509 !important; }
.career-studio.cs-dark-ui .cs-start-path-option.is-active small,
.career-studio.cs-dark-ui .cs-template-option.is-active small { color: #4e4318 !important; }
.career-studio.cs-dark-ui .cs-builder-toolbar { border-color: #7f7138; background: linear-gradient(135deg, #0e120f, #221e0d); }
.career-studio.cs-dark-ui .cs-resume-preview { color: #171717 !important; background: #fff !important; }
.career-studio.cs-dark-ui .cs-resume-preview :is(.resume-name,.resume-section-title) { color: #171717 !important; }
.career-studio.cs-dark-ui .cs-resume-preview :is(.resume-copy,.resume-meta,.resume-skill) { color: #3d3d3d !important; }

@media (max-width: 920px) {
    .career-studio .cs-start-path-options,
    .career-studio .cs-template-options { grid-template-columns: 1fr !important; }
    .career-studio .cs-start-path-option,
    .career-studio .cs-template-option { min-height: 0 !important; }
}
@media (max-width: 760px) {
    .career-studio .cs-builder-toolbar { grid-template-columns: 1fr; padding: 16px; }
    .career-studio .cs-builder-toolbar .cs-toolbar-actions { justify-content: flex-start; }
    .career-studio .cs-import-resume { padding: 18px; }
}


/* ===== career-studio-preview-theme-v14.css ===== */
/*
| GraphicBidu Career Studio v14
| Preview, export surface, support hero and theme-surface repair.
| Product-local only. No global layout selectors.
*/

/* --------------------------------------------------------------------------
   Export actions — deliberately light paper in BOTH site themes.
   -------------------------------------------------------------------------- */
.career-studio .cs-builder-toolbar.cs-export-light-v14 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 14px 20px !important;
    align-items: center !important;
    margin: 0 0 18px !important;
    padding: 20px 22px !important;
    border: 1px solid #dfd3b1 !important;
    border-radius: 18px !important;
    color: #171713 !important;
    background: linear-gradient(135deg, #fffefa 0%, #faf4e5 100%) !important;
    box-shadow: 0 14px 30px rgba(48, 38, 13, .08) !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 > div:first-child::before {
    content: 'EXPORT YOUR RESUME';
    display: block;
    margin-bottom: 6px;
    color: #80610b !important;
    font-size: .66rem;
    font-weight: 950;
    letter-spacing: .13em;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-toolbar-label,
.career-studio .cs-builder-toolbar.cs-export-light-v14 strong,
.career-studio .cs-builder-toolbar.cs-export-light-v14 h1,
.career-studio .cs-builder-toolbar.cs-export-light-v14 h2,
.career-studio .cs-builder-toolbar.cs-export-light-v14 h3 {
    color: #171713 !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 p,
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-export-note,
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-export-detail {
    color: #655d4e !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-toolbar-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-end !important;
    gap: 9px !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-export-note,
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-export-detail {
    grid-column: 1 / -1;
    margin: 0 !important;
    padding-top: 11px;
    border-top: 1px solid #e7ddc8;
    font-size: .78rem;
    line-height: 1.5;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-export-detail {
    padding-top: 0;
    border-top: 0;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-export-detail strong { color: #171713 !important; }
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-button-primary {
    color: #fff !important;
    background: #171713 !important;
    border-color: #171713 !important;
    box-shadow: 0 8px 18px rgba(20, 19, 15, .16) !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-button-primary:hover,
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-button-primary:focus-visible {
    color: #fff !important;
    background: #38342a !important;
    border-color: #38342a !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-button-secondary {
    color: #604b08 !important;
    background: #fffdf8 !important;
    border-color: #c6a73d !important;
    box-shadow: none !important;
}
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-button-secondary:hover,
.career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-button-secondary:focus-visible {
    color: #413305 !important;
    background: #fff4c8 !important;
    border-color: #a7861b !important;
}

/* --------------------------------------------------------------------------
   Live preview — intentional paper, better scale, and readable hierarchy.
   -------------------------------------------------------------------------- */
.career-studio .cs-preview-card.cs-preview-premium-v14 {
    padding: 15px !important;
    border: 1px solid #d8cfbe !important;
    border-radius: 20px !important;
    background: linear-gradient(145deg, #fffefa, #f4efe3) !important;
    box-shadow: 0 18px 36px rgba(35, 28, 13, .10) !important;
    overflow: hidden;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-insight-heading {
    padding: 3px 4px 10px;
    color: #776f60 !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-insight-heading strong { color: #181713 !important; }
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-preview {
    min-height: 560px !important;
    max-height: 680px !important;
    margin: 0 0 14px !important;
    padding: 14px !important;
    overflow: auto !important;
    border: 1px solid #e2d9c9 !important;
    border-radius: 13px !important;
    background:
        linear-gradient(rgba(255,255,255,.75), rgba(255,255,255,.75)),
        repeating-linear-gradient(0deg, rgba(143,127,86,.045) 0 1px, transparent 1px 30px) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.8) !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-sheet {
    min-height: 100%;
    padding: 22px 20px !important;
    border: 1px solid #dbd1c0 !important;
    border-radius: 3px !important;
    color: #1d1a14 !important;
    background: #fff !important;
    box-shadow: 0 12px 25px rgba(28, 22, 9, .11) !important;
    font-family: Arial, Helvetica, sans-serif !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-header {
    padding-bottom: 11px !important;
    margin-bottom: 13px !important;
    border-bottom: 2px solid #2b2923 !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-name {
    color: #171713 !important;
    font-size: 1.52rem !important;
    letter-spacing: -.055em !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-role {
    color: #5c564b !important;
    font-size: .8rem !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-contact,
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-link,
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-preview-job span {
    color: #625b4f !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-section { margin-top: 14px !important; }
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-section h4 {
    padding-bottom: 4px !important;
    border-bottom: 1px solid #b8b0a2 !important;
    color: #211e18 !important;
    font-size: .7rem !important;
    letter-spacing: .1em !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-section p,
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-section li {
    color: #373229 !important;
    font-size: .7rem !important;
    line-height: 1.54 !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-preview-job strong { color: #171713 !important; }
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-skills span {
    border: 1px solid #e4dccb;
    color: #39342b !important;
    background: #f6f3ea !important;
}
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-preview-actions { gap: 8px !important; }
.career-studio .cs-preview-card.cs-preview-premium-v14 .cs-preview-actions .cs-button { min-height: 42px; }

/* --------------------------------------------------------------------------
   Support — the primary visual callout. It stays dark in light AND dark mode.
   -------------------------------------------------------------------------- */
.career-studio .cs-support-section.cs-support-hero-v14,
.career-studio.cs-light-ui .cs-support-section.cs-support-hero-v14,
.career-studio.cs-dark-ui .cs-support-section.cs-support-hero-v14 {
    position: relative !important;
    isolation: isolate;
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, .95fr) !important;
    gap: clamp(24px, 4vw, 64px) !important;
    align-items: center !important;
    margin: clamp(26px, 4vw, 52px) 0 !important;
    padding: clamp(30px, 5vw, 58px) !important;
    overflow: hidden !important;
    border: 1px solid rgba(231, 202, 88, .62) !important;
    border-radius: 26px !important;
    color: #fffdf5 !important;
    background:
        radial-gradient(circle at 89% 12%, rgba(236, 207, 83, .24), transparent 28%),
        radial-gradient(circle at 7% 108%, rgba(185, 140, 20, .18), transparent 33%),
        linear-gradient(118deg, #0e100d 0%, #18170f 56%, #29200b 100%) !important;
    box-shadow: 0 28px 62px rgba(24, 20, 7, .25) !important;
}
.career-studio .cs-support-section.cs-support-hero-v14::before {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0;
    opacity: .34;
    background-image: radial-gradient(rgba(249, 225, 130, .22) 1px, transparent 1px);
    background-size: 16px 16px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 28%, #000 80%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 28%, #000 80%, transparent);
    pointer-events: none;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-copy,
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-box { position: relative; z-index: 1; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-eyebrow,
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-copy .cs-eyebrow { color: #efd773 !important; }
.career-studio .cs-support-section.cs-support-hero-v14 h2,
.career-studio.cs-light-ui .cs-support-section.cs-support-hero-v14 h2,
.career-studio.cs-dark-ui .cs-support-section.cs-support-hero-v14 h2 {
    margin: 7px 0 12px !important;
    color: #fffdf4 !important;
    font-size: clamp(2rem, 4vw, 3.35rem) !important;
    line-height: .98 !important;
    letter-spacing: -.065em !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 p,
.career-studio.cs-light-ui .cs-support-section.cs-support-hero-v14 p,
.career-studio.cs-dark-ui .cs-support-section.cs-support-hero-v14 p {
    max-width: 660px !important;
    color: rgba(255,255,255,.78) !important;
    font-size: 1rem !important;
    line-height: 1.62 !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-fineprint {
    color: rgba(255,255,255,.63) !important;
    font-size: .78rem !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-box,
.career-studio.cs-light-ui .cs-support-section.cs-support-hero-v14 .cs-support-box,
.career-studio.cs-dark-ui .cs-support-section.cs-support-hero-v14 .cs-support-box {
    padding: 24px !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 20px !important;
    color: #fffdf5 !important;
    background: linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.045)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 18px 35px rgba(0,0,0,.18) !important;
    backdrop-filter: blur(10px);
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-amounts { gap: 9px !important; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-amount {
    color: #fff8d4 !important;
    border-color: rgba(239, 211, 104, .7) !important;
    background: rgba(10, 11, 8, .34) !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-amount.is-active,
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-amount:hover,
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-amount:focus-visible {
    color: #161308 !important;
    border-color: #f1d461 !important;
    background: #f1d461 !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-custom-label { color: #fff8d5 !important; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-input-wrap {
    border-color: rgba(255,255,255,.22) !important;
    background: #fffdf7 !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-input-wrap span { color: #241d08 !important; background: #f0df99 !important; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-input-wrap input { color: #18150b !important; background: #fffdf7 !important; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-help { color: rgba(255,255,255,.66) !important; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-button {
    min-height: 52px !important;
    color: #171307 !important;
    background: linear-gradient(135deg, #f1d45e, #dfbd31) !important;
    border-color: #f1d45e !important;
    box-shadow: 0 12px 24px rgba(0,0,0,.26) !important;
}
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-button:hover,
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-button:focus-visible { background: #ffe88a !important; }
.career-studio .cs-support-section.cs-support-hero-v14 .cs-support-status { color: #f7e9ad !important; }

/* --------------------------------------------------------------------------
   Theme reliability: direct surface colours for all common app modules.
   -------------------------------------------------------------------------- */
.career-studio.cs-v14-light .cs-panel,
.career-studio.cs-v14-light .cs-form-section,
.career-studio.cs-v14-light .cs-repeat-card,
.career-studio.cs-v14-light .cs-import-resume,
.career-studio.cs-v14-light .cs-start-path,
.career-studio.cs-v14-light .cs-template-picker,
.career-studio.cs-v14-light .cs-insight-card,
.career-studio.cs-v14-light .cs-quality-coach,
.career-studio.cs-v14-light .cs-job-result,
.career-studio.cs-v14-light .cs-game-card {
    color: #181713 !important;
    background-color: #fffdf8 !important;
    border-color: #ded6c8 !important;
}
.career-studio.cs-v14-dark .cs-panel,
.career-studio.cs-v14-dark .cs-form-section,
.career-studio.cs-v14-dark .cs-repeat-card,
.career-studio.cs-v14-dark .cs-import-resume,
.career-studio.cs-v14-dark .cs-start-path,
.career-studio.cs-v14-dark .cs-template-picker,
.career-studio.cs-v14-dark .cs-insight-card,
.career-studio.cs-v14-dark .cs-quality-coach,
.career-studio.cs-v14-dark .cs-job-result,
.career-studio.cs-v14-dark .cs-game-card {
    color: #f7f5ec !important;
    background-color: #151b17 !important;
    border-color: #34433a !important;
}
.career-studio.cs-v14-dark :is(.cs-panel,.cs-form-section,.cs-repeat-card,.cs-import-resume,.cs-start-path,.cs-template-picker,.cs-insight-card,.cs-quality-coach,.cs-job-result,.cs-game-card) :is(h1,h2,h3,h4,strong,label) { color: #f7f5ec !important; }
.career-studio.cs-v14-dark :is(.cs-panel,.cs-form-section,.cs-repeat-card,.cs-import-resume,.cs-start-path,.cs-template-picker,.cs-insight-card,.cs-quality-coach,.cs-job-result,.cs-game-card) :is(p,small,li,.cs-form-note,.cs-export-note,.cs-export-detail) { color: #b9c2b9 !important; }
.career-studio.cs-v14-dark :is(input,textarea,select,.cs-answer-button) { color: #f7f5ec !important; background: #0e1510 !important; border-color: #3b4b40 !important; }
.career-studio.cs-v14-dark select { color-scheme: dark; }
.career-studio.cs-v14-dark select option { color: #f7f5ec; background: #111811; }
.career-studio.cs-v14-dark .cs-resume-preview,
.career-studio.cs-v14-dark .cs-resume-sheet { color: #1d1a14 !important; }

@media (max-width: 960px) {
    .career-studio .cs-support-section.cs-support-hero-v14 { grid-template-columns: 1fr !important; padding: 28px 22px !important; }
    .career-studio .cs-preview-card.cs-preview-premium-v14 .cs-resume-preview { min-height: 420px !important; max-height: 560px !important; }
}
@media (max-width: 720px) {
    .career-studio .cs-builder-toolbar.cs-export-light-v14 { grid-template-columns: 1fr !important; padding: 17px !important; }
    .career-studio .cs-builder-toolbar.cs-export-light-v14 .cs-toolbar-actions { justify-content: flex-start !important; }
    .career-studio .cs-support-section.cs-support-hero-v14 { margin: 24px 0 !important; padding: 26px 18px !important; border-radius: 20px !important; }
    .career-studio .cs-support-section.cs-support-hero-v14 h2 { font-size: 2.1rem !important; }
    .career-studio .cs-support-section.cs-support-hero-v14 .cs-support-box { padding: 18px !important; }
}


/* ===== career-studio-template-switch-v15.css ===== */
/* GraphicBidu Career Studio v15 — template picker states and preview variants. */
.career-studio .cs-template-option {
  position: relative;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.career-studio .cs-template-option:hover,
.career-studio .cs-template-option:focus-visible {
  transform: translateY(-2px);
  border-color: #b69418 !important;
  box-shadow: 0 10px 22px rgba(83, 64, 4, .11);
  outline: none;
}

.career-studio .cs-template-option.is-selected-v15,
.career-studio .cs-template-option.is-active {
  border-color: #b69418 !important;
  background: linear-gradient(145deg, #fffdf6, #f4eccf) !important;
  box-shadow: inset 0 0 0 1px rgba(182, 148, 24, .22), 0 9px 20px rgba(93, 71, 5, .10) !important;
}

.career-studio .cs-template-option.is-selected-v15::after {
  content: 'SELECTED';
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 4px 6px;
  border-radius: 999px;
  color: #1c1810;
  background: #e6ca42;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.career-studio .cs-template-status-v15 {
  margin: 12px 0 0;
  color: #5f573f;
  font-size: 12px;
  font-weight: 700;
}

.career-studio .cs-builder-toolbar[data-resume-template="classic"] .cs-toolbar-label::after,
.career-studio .cs-builder-toolbar[data-resume-template="executive"] .cs-toolbar-label::after,
.career-studio .cs-builder-toolbar[data-resume-template="modern"] .cs-toolbar-label::after {
  display: inline-block;
  margin-left: 8px;
  padding: 3px 7px;
  border: 1px solid #d8c884;
  border-radius: 999px;
  color: #715b08;
  background: #fff9df;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .07em;
  vertical-align: middle;
}
.career-studio .cs-builder-toolbar[data-resume-template="classic"] .cs-toolbar-label::after { content: 'CLASSIC ATS'; }
.career-studio .cs-builder-toolbar[data-resume-template="executive"] .cs-toolbar-label::after { content: 'EXECUTIVE'; }
.career-studio .cs-builder-toolbar[data-resume-template="modern"] .cs-toolbar-label::after { content: 'MODERN'; }

/* The in-app preview visibly follows the selected template. */
.career-studio #resumePreview .cs-resume-sheet.cs-template-classic-v15 {
  border-top: 3px solid #2b2924;
  border-left: 1px solid #ded8ca;
}
.career-studio #resumePreview .cs-resume-sheet.cs-template-classic-v15 .cs-resume-header {
  border-bottom-color: #2b2924;
}

.career-studio #resumePreview .cs-resume-sheet.cs-template-executive-v15 {
  border-left: 8px solid #25241f;
  box-shadow: 0 13px 29px rgba(31, 29, 22, .18);
}
.career-studio #resumePreview .cs-resume-sheet.cs-template-executive-v15 .cs-resume-header {
  margin-left: -8px;
  padding: 14px 12px 12px 16px;
  color: #fffdf5;
  background: #25241f;
  border-bottom: 0;
}
.career-studio #resumePreview .cs-resume-sheet.cs-template-executive-v15 .cs-resume-header :is(.cs-resume-name, .cs-resume-role, .cs-resume-contact) {
  color: #fffdf5 !important;
}

.career-studio #resumePreview .cs-resume-sheet.cs-template-modern-v15 {
  border-top: 8px solid #c4a018;
  box-shadow: 0 13px 29px rgba(111, 82, 2, .15);
}
.career-studio #resumePreview .cs-resume-sheet.cs-template-modern-v15 .cs-resume-header {
  border-bottom-color: #c4a018;
}
.career-studio #resumePreview .cs-resume-sheet.cs-template-modern-v15 .cs-resume-name {
  color: #715b08;
}

/* Site dark mode keeps the builder readable while preview remains a deliberate paper surface. */
.career-studio.cs-dark-ui .cs-template-picker,
.career-studio.cs-v14-dark .cs-template-picker {
  background: #191915 !important;
  border-color: #3a382e !important;
}
.career-studio.cs-dark-ui .cs-template-picker :is(strong, p, small),
.career-studio.cs-v14-dark .cs-template-picker :is(strong, p, small) {
  color: #f7f2df !important;
}
.career-studio.cs-dark-ui .cs-template-status-v15,
.career-studio.cs-v14-dark .cs-template-status-v15 {
  color: #ded2aa !important;
}
.career-studio.cs-dark-ui .cs-template-option,
.career-studio.cs-v14-dark .cs-template-option {
  border-color: #4b473a !important;
  background: #24231e !important;
}
.career-studio.cs-dark-ui .cs-template-option.is-selected-v15,
.career-studio.cs-v14-dark .cs-template-option.is-selected-v15,
.career-studio.cs-dark-ui .cs-template-option.is-active,
.career-studio.cs-v14-dark .cs-template-option.is-active {
  background: linear-gradient(145deg, #3a3215, #27251b) !important;
  border-color: #d6b832 !important;
}
.career-studio.cs-dark-ui .cs-builder-toolbar[data-resume-template] .cs-toolbar-label::after,
.career-studio.cs-v14-dark .cs-builder-toolbar[data-resume-template] .cs-toolbar-label::after {
  color: #f6e6a0;
  border-color: #7e6921;
  background: #2a2615;
}


/* ===== career-studio-dark-theme-v16.css ===== */
/*
| GraphicBidu Career Studio v16
| Final dark-theme contrast repair.
| Product-scoped. Loaded after v10, v12, v14 and v15 assets.
*/

/* This class is written by career-studio-dark-theme-v16.js. */
.career-studio.cs-dark-v16 {
    --cs-ink: #f8f6ee;
    --cs-paper: #090d0a;
    --cs-panel: #141a14;
    --cs-muted: #c1cbc0;
    --cs-line: #334134;
    --cs-warm: #e3c94e;
    --cs-warm-dark: #f0dc7d;
    --cs-success: #70d09a;
    --cs-danger: #f19a8d;
    --cs-shadow: 0 24px 56px rgba(0, 0, 0, .35);
    color: #f8f6ee !important;
    background:
        radial-gradient(circle at 86% 5%, rgba(193, 153, 17, .10), transparent 23rem),
        linear-gradient(180deg, #0b100c 0%, #090d0a 100%) !important;
}

.career-studio.cs-dark-v16 :is(h1,h2,h3,h4,strong,label,summary) {
    color: #f8f6ee !important;
}
.career-studio.cs-dark-v16 :is(p,small,li,.cs-form-note,.cs-local-note,.cs-crawl-note) {
    color: #c1cbc0 !important;
}
.career-studio.cs-dark-v16 .cs-eyebrow { color: #f0d769 !important; }

/* Hero + Truth Lock ------------------------------------------------------ */
.career-studio.cs-dark-v16 .cs-hero-copy { color: #c8d2c7 !important; }
.career-studio.cs-dark-v16 .cs-hero-points span {
    color: #f6f1dc !important;
    border-color: #5a623f !important;
    background: #161d16 !important;
}
.career-studio.cs-dark-v16 .cs-truth-card {
    border: 1px solid rgba(231, 202, 88, .55) !important;
    color: #fffdf2 !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(233, 202, 77, .16), transparent 42%),
        linear-gradient(145deg, #191b15, #10150f) !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.28) !important;
}
.career-studio.cs-dark-v16 .cs-truth-card strong { color: #fffdf2 !important; }
.career-studio.cs-dark-v16 .cs-truth-card p { color: #d8dfd2 !important; }
.career-studio.cs-dark-v16 .cs-truth-icon { color: #f0d769 !important; border-color: #f0d769 !important; }

/* Three value cards and section navigation ---------------------------- */
.career-studio.cs-dark-v16 .cs-premium-value-strip {
    border-color: #364235 !important;
    background: #364235 !important;
    box-shadow: none !important;
}
.career-studio.cs-dark-v16 .cs-premium-value-strip > div {
    background: linear-gradient(145deg, #171e18, #111711) !important;
}
.career-studio.cs-dark-v16 .cs-premium-value-strip strong { color: #fffdf2 !important; }
.career-studio.cs-dark-v16 .cs-premium-value-strip span { color: #c2ccc0 !important; }

.career-studio.cs-dark-v16 .cs-launch-workflow,
.career-studio.cs-dark-v16 .cs-progress-wrap {
    border-color: #334034 !important;
    background: #131914 !important;
    box-shadow: none !important;
}
.career-studio.cs-dark-v16 .cs-launch-workflow-title strong,
.career-studio.cs-dark-v16 .cs-launch-workflow li strong { color: #fffdf2 !important; }
.career-studio.cs-dark-v16 .cs-launch-workflow li small { color: #c1cbc0 !important; }
.career-studio.cs-dark-v16 .cs-launch-workflow li > span {
    color: #171b14 !important;
    background: #ead15a !important;
}
.career-studio.cs-dark-v16 .cs-progress-step {
    color: #d2dbd0 !important;
    background: transparent !important;
}
.career-studio.cs-dark-v16 .cs-progress-step span {
    color: #ced8cd !important;
    background: #293329 !important;
}
.career-studio.cs-dark-v16 .cs-progress-step.is-active {
    color: #181b14 !important;
    background: #f4edda !important;
}
.career-studio.cs-dark-v16 .cs-progress-step.is-active span {
    color: #181b14 !important;
    background: #e4ca49 !important;
}

/* Core cards ------------------------------------------------------------ */
.career-studio.cs-dark-v16 :is(.cs-panel,.cs-form-section,.cs-repeat-card,.cs-photo-row,.cs-start-path,.cs-template-picker,.cs-insight-card,.cs-quality-coach,.cs-job-result,.cs-game-card) {
    border-color: #324033 !important;
    background: #151b15 !important;
    color: #f8f6ee !important;
}
.career-studio.cs-dark-v16 .cs-start-path-option,
.career-studio.cs-dark-v16 .cs-template-option {
    color: #f8f6ee !important;
    border-color: #3d4b3d !important;
    background: #1c241d !important;
}
.career-studio.cs-dark-v16 .cs-start-path-option small,
.career-studio.cs-dark-v16 .cs-template-option small { color: #c1cbc0 !important; }
.career-studio.cs-dark-v16 .cs-start-path-option.is-active,
.career-studio.cs-dark-v16 .cs-template-option.is-active,
.career-studio.cs-dark-v16 .cs-template-option.is-selected-v15 {
    color: #171b14 !important;
    border-color: #dfc24a !important;
    background: linear-gradient(145deg, #f3e9bf, #d8bd42) !important;
}
.career-studio.cs-dark-v16 .cs-start-path-option.is-active :is(strong,small),
.career-studio.cs-dark-v16 .cs-template-option.is-active :is(strong,small),
.career-studio.cs-dark-v16 .cs-template-option.is-selected-v15 :is(strong,small) { color: #171b14 !important; }

.career-studio.cs-dark-v16 :is(input,textarea,select,.cs-answer-button) {
    color: #f4f6ef !important;
    border-color: #405040 !important;
    background: #0f1510 !important;
}
.career-studio.cs-dark-v16 :is(input,textarea)::placeholder { color: #91a091 !important; }
.career-studio.cs-dark-v16 select { color-scheme: dark; }
.career-studio.cs-dark-v16 select option { color: #f4f6ef; background: #101611; }

/* The resume export block is intentionally PAPER in every site theme. */
.career-studio.cs-dark-v16 .cs-builder-toolbar.cs-export-light-v14 {
    color: #1c1a14 !important;
    border-color: #dbcfae !important;
    background: linear-gradient(135deg, #fffefa 0%, #faf2df 100%) !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.17) !important;
}
.career-studio.cs-dark-v16 .cs-builder-toolbar.cs-export-light-v14 :is(strong,h1,h2,h3,.cs-toolbar-label) { color: #1c1a14 !important; }
.career-studio.cs-dark-v16 .cs-builder-toolbar.cs-export-light-v14 :is(p,.cs-export-note,.cs-export-detail) { color: #665e4e !important; }
.career-studio.cs-dark-v16 .cs-builder-toolbar.cs-export-light-v14 .cs-button-primary {
    color: #fff !important;
    border-color: #191813 !important;
    background: #191813 !important;
}
.career-studio.cs-dark-v16 .cs-builder-toolbar.cs-export-light-v14 .cs-button-secondary {
    color: #624b05 !important;
    border-color: #c5a435 !important;
    background: #fffdf7 !important;
}

/* Build / tailor footer: it must not become an unreadable white slab. */
.career-studio.cs-dark-v16 .cs-builder-footer {
    border-color: #5f572c !important;
    background: linear-gradient(135deg, #1e2116, #171a12) !important;
}
.career-studio.cs-dark-v16 .cs-builder-footer strong { color: #fffdf1 !important; }
.career-studio.cs-dark-v16 .cs-builder-footer p { color: #c8d1c4 !important; }
.career-studio.cs-dark-v16 .cs-builder-footer .cs-button-primary {
    color: #171b14 !important;
    border-color: #e5cf4f !important;
    background: #e5cf4f !important;
}
.career-studio.cs-dark-v16 .cs-builder-footer .cs-button-secondary {
    color: #f4df78 !important;
    border-color: #8a782a !important;
    background: #141913 !important;
}

/* Preview is a deliberate white paper surface. Override broad old dark rules. */
.career-studio.cs-dark-v16 .cs-preview-card.cs-preview-premium-v14 {
    border-color: #3d493d !important;
    background: #171d17 !important;
}
.career-studio.cs-dark-v16 .cs-preview-card.cs-preview-premium-v14 .cs-insight-heading { color: #dbe3d8 !important; }
.career-studio.cs-dark-v16 .cs-preview-card.cs-preview-premium-v14 .cs-insight-heading strong { color: #fffdf1 !important; }
.career-studio.cs-dark-v16 #resumePreview {
    border-color: #cfc5ae !important;
    background: #e9e4d8 !important;
}
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet {
    color: #29251f !important;
    background: #fff !important;
}
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet :is(h1,h2,h3,h4,strong,p,li,span,a) {
    color: #332f27 !important;
    opacity: 1 !important;
}
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet .cs-resume-name { color: #171510 !important; }
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet .cs-resume-role,
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet .cs-resume-contact,
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet .cs-resume-link { color: #665f54 !important; }
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet .cs-resume-section h4 { color: #211e18 !important; }
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet .cs-resume-skills span { color: #3b362c !important; background: #f6f3ea !important; }
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet.cs-template-executive-v15 .cs-resume-header,
.career-studio.cs-dark-v16 #resumePreview .cs-resume-sheet.cs-template-executive-v15 .cs-resume-header :is(h1,h2,h3,h4,strong,p,span,a) {
    color: #fffdf5 !important;
    background: #25241f !important;
}

/* SEO guide, value cards, FAQ and internal links — red-box fix. ---------- */
.career-studio.cs-dark-v16 .cs-search-guide {
    border-color: #334033 !important;
    background: linear-gradient(145deg, #151c16, #101610) !important;
    box-shadow: none !important;
}
.career-studio.cs-dark-v16 .cs-search-guide-intro > p:not(.cs-search-guide-disclaimer),
.career-studio.cs-dark-v16 .cs-search-guide-intro > p:last-child { color: #c5cec2 !important; }
.career-studio.cs-dark-v16 .cs-search-guide-disclaimer {
    color: #d9e0d4 !important;
    border-left-color: #e4ca4b !important;
    background: #20281f !important;
}
.career-studio.cs-dark-v16 .cs-search-guide-disclaimer strong { color: #fff1a8 !important; }
.career-studio.cs-dark-v16 .cs-search-guide-grid article {
    border-color: #3b493b !important;
    background: #1c241d !important;
}
.career-studio.cs-dark-v16 .cs-search-guide-grid article h3 { color: #fffdf2 !important; }
.career-studio.cs-dark-v16 .cs-search-guide-grid article p { color: #c4cec2 !important; }
.career-studio.cs-dark-v16 .cs-search-guide-grid article span {
    color: #1b1a12 !important;
    background: #ecd55e !important;
}
.career-studio.cs-dark-v16 .cs-role-guide {
    border: 1px solid #544b22 !important;
    background: linear-gradient(135deg, #1b1c14, #28230f) !important;
}
.career-studio.cs-dark-v16 .cs-role-guide h3 { color: #fffdf3 !important; }
.career-studio.cs-dark-v16 .cs-role-guide li { color: #d6dfd3 !important; }
.career-studio.cs-dark-v16 .cs-role-guide li::before { color: #e5cf4f !important; }
.career-studio.cs-dark-v16 .cs-faq details {
    border-color: #3a483a !important;
    background: #171e18 !important;
}
.career-studio.cs-dark-v16 .cs-faq summary { color: #f4f6ef !important; }
.career-studio.cs-dark-v16 .cs-faq details p { color: #c9d2c7 !important; }
.career-studio.cs-dark-v16 .cs-search-links a {
    color: #171b14 !important;
    border-color: #e5cf4f !important;
    background: #f3ecd8 !important;
}
.career-studio.cs-dark-v16 .cs-search-links a:hover { background: #e5cf4f !important; }

/* Support remains the only major black-gold surface by design. */
.career-studio.cs-dark-v16 .cs-support-section.cs-support-hero-v14 {
    color: #fffdf4 !important;
    border-color: rgba(231,202,88,.72) !important;
    background:
        radial-gradient(circle at 90% 12%, rgba(236, 207, 83, .25), transparent 28%),
        radial-gradient(circle at 7% 108%, rgba(185, 140, 20, .20), transparent 33%),
        linear-gradient(118deg, #0c0e0b 0%, #15140d 56%, #281f08 100%) !important;
}
.career-studio.cs-dark-v16 .cs-support-section.cs-support-hero-v14 :is(h2,strong) { color: #fffdf4 !important; }
.career-studio.cs-dark-v16 .cs-support-section.cs-support-hero-v14 p { color: #e1e2d3 !important; }

/* Responsive safety. */
@media (max-width: 780px) {
    .career-studio.cs-dark-v16 .cs-premium-value-strip,
    .career-studio.cs-dark-v16 .cs-search-guide-grid { grid-template-columns: 1fr !important; }
    .career-studio.cs-dark-v16 .cs-builder-footer { align-items: stretch !important; }
}


/* ===== career-studio-contrast-v17.css ===== */
/*
| GraphicBidu Career Studio v17
| Targeted contrast correction for user-reported light/dark UI points.
| Loaded after the v16 product stylesheet only.
*/

/* -------------------------------------------------------------------------
   DARK SITE THEME
   1) Career-discovery actions need dark readable text on their light buttons.
   ------------------------------------------------------------------------- */
.career-studio.cs-dark-v16 .cs-search-links a,
.career-studio.cs-dark-v16 .cs-search-links a:link,
.career-studio.cs-dark-v16 .cs-search-links a:visited,
.career-studio.cs-dark-v16 .cs-search-links a:hover,
.career-studio.cs-dark-v16 .cs-search-links a:focus-visible,
.career-studio.cs-dark-v16 .cs-search-links a * {
    color: #171914 !important;
    -webkit-text-fill-color: #171914 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.career-studio.cs-dark-v16 .cs-search-links a {
    background: #f4eed7 !important;
    border-color: #e4cd5a !important;
    font-weight: 800 !important;
}

.career-studio.cs-dark-v16 .cs-search-links a:hover,
.career-studio.cs-dark-v16 .cs-search-links a:focus-visible {
    background: #e5cf4f !important;
    border-color: #f5df70 !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .25) !important;
}

/* -------------------------------------------------------------------------
   DARK SITE THEME
   2) Every numbered form heading becomes one clear gold label with dark ink.
   The label includes the serial number and its title: 1 Professional identity,
   2 Experience, 3 Skills, 4 Education & credentials, 5 Links & final details.
   ------------------------------------------------------------------------- */
.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: fit-content !important;
    max-width: 100% !important;
    padding: 7px 12px 7px 8px !important;
    border: 1px solid #eed96b !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #f6edbd 0%, #e1c650 100%) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .22) !important;
}

.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div > span,
.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div > h3,
.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div > h3 * {
    color: #171914 !important;
    -webkit-text-fill-color: #171914 !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div > span {
    display: inline-grid !important;
    place-items: center !important;
    width: 28px !important;
    height: 28px !important;
    flex: 0 0 28px !important;
    border: 1px solid #171914 !important;
    border-radius: 50% !important;
    background: #171914 !important;
    color: #f9eea6 !important;
    -webkit-text-fill-color: #f9eea6 !important;
    font-weight: 900 !important;
}

.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div > h3 {
    margin: 0 !important;
    font-size: clamp(1rem, 1.2vw, 1.15rem) !important;
    line-height: 1.2 !important;
    font-weight: 900 !important;
}

/* Preserve supporting copy as light, readable supporting text on dark. */
.career-studio.cs-dark-v16 .cs-form-section .cs-section-title > p {
    color: #cbd5c9 !important;
    -webkit-text-fill-color: #cbd5c9 !important;
    opacity: 1 !important;
}

/* -------------------------------------------------------------------------
   LIGHT SITE THEME
   3) Truth Lock is intentionally a dark trust card; every line uses light ink.
   ------------------------------------------------------------------------- */
.career-studio.cs-light-v16 .cs-truth-card,
.career-studio:not(.cs-dark-v16).cs-light-ui .cs-truth-card,
.career-studio.cs-v14-light .cs-truth-card {
    color: #fffdf4 !important;
    border: 1px solid rgba(215, 185, 57, .78) !important;
    background:
        radial-gradient(circle at 100% 0%, rgba(237, 210, 82, .19), transparent 46%),
        linear-gradient(145deg, #171914 0%, #222015 100%) !important;
    box-shadow: 0 18px 40px rgba(27, 24, 11, .18) !important;
}

.career-studio.cs-light-v16 .cs-truth-card :is(strong,p,span,div),
.career-studio:not(.cs-dark-v16).cs-light-ui .cs-truth-card :is(strong,p,span,div),
.career-studio.cs-v14-light .cs-truth-card :is(strong,p,span,div) {
    opacity: 1 !important;
    text-shadow: none !important;
}

.career-studio.cs-light-v16 .cs-truth-card strong,
.career-studio:not(.cs-dark-v16).cs-light-ui .cs-truth-card strong,
.career-studio.cs-v14-light .cs-truth-card strong {
    color: #fffdf4 !important;
    -webkit-text-fill-color: #fffdf4 !important;
}

.career-studio.cs-light-v16 .cs-truth-card p,
.career-studio:not(.cs-dark-v16).cs-light-ui .cs-truth-card p,
.career-studio.cs-v14-light .cs-truth-card p {
    color: #e7eadf !important;
    -webkit-text-fill-color: #e7eadf !important;
}

.career-studio.cs-light-v16 .cs-truth-card .cs-truth-icon,
.career-studio:not(.cs-dark-v16).cs-light-ui .cs-truth-card .cs-truth-icon,
.career-studio.cs-v14-light .cs-truth-card .cs-truth-icon {
    color: #f3db66 !important;
    -webkit-text-fill-color: #f3db66 !important;
    border-color: #f3db66 !important;
}

@media (max-width: 680px) {
    .career-studio.cs-dark-v16 .cs-form-section .cs-section-title > div {
        border-radius: 14px !important;
        align-items: flex-start !important;
    }
}


/* ===== career-studio-mobile-game-v18.css ===== */
/*
| GraphicBidu Career Studio v18
| Mobile support-card layout + dark game label contrast repair.
| Product-scoped only. Loaded after v17.
*/

/* -------------------------------------------------------------------------
   MOBILE: Support GraphicBidu must become a deliberate vertical donation card.
   This class is applied only by the product-local v18 JS below 820px.
   It avoids the old desktop min-width grid rule that squeezed the copy into
   one-word-per-line text on phones.
   ------------------------------------------------------------------------- */
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    grid-template-columns: none !important;
    gap: 22px !important;
    min-width: 0 !important;
    padding: 28px 18px !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 > .cs-support-copy,
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 > .cs-support-box {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-copy {
    display: block !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-eyebrow,
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 h2,
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 p,
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-fineprint {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 h2 {
    margin-top: 8px !important;
    font-size: clamp(2rem, 10vw, 2.5rem) !important;
    line-height: .98 !important;
    letter-spacing: -.055em !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-box {
    padding: 18px !important;
    border-radius: 18px !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-amounts {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
    width: 100% !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-amount,
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-button,
.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-input-wrap {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-button {
    min-height: 54px !important;
    font-size: .94rem !important;
}

@media (max-width: 820px) {
    .career-studio .cs-support-section.cs-support-hero-v14 {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        grid-template-columns: none !important;
        gap: 22px !important;
        min-width: 0 !important;
    }

    .career-studio .cs-support-section.cs-support-hero-v14 > .cs-support-copy,
    .career-studio .cs-support-section.cs-support-hero-v14 > .cs-support-box {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 440px) {
    .career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 {
        margin: 22px 0 !important;
        padding: 24px 16px !important;
        border-radius: 20px !important;
    }

    .career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 .cs-support-box {
        padding: 16px !important;
    }

    .career-studio.cs-mobile-v18 .cs-support-section.cs-support-hero-v14 p {
        font-size: .95rem !important;
        line-height: 1.58 !important;
    }
}

/* -------------------------------------------------------------------------
   DARK THEME: Character name pills in Recruiter Rush stay dark and readable.
   The arena itself remains a light cartoon playfield intentionally.
   ------------------------------------------------------------------------- */
.career-studio.cs-dark-v16 .cs-game-arena .cs-fighter-label,
.career-studio.cs-v14-dark .cs-game-arena .cs-fighter-label,
.career-studio.cs-dark-ui .cs-game-arena .cs-fighter-label {
    color: #181713 !important;
    -webkit-text-fill-color: #181713 !important;
    background: #f7efd0 !important;
    border-color: #d9ba47 !important;
    text-shadow: none !important;
    opacity: 1 !important;
}

.career-studio.cs-dark-v16 .cs-game-arena .cs-fighter-label *,
.career-studio.cs-v14-dark .cs-game-arena .cs-fighter-label *,
.career-studio.cs-dark-ui .cs-game-arena .cs-fighter-label * {
    color: #181713 !important;
    -webkit-text-fill-color: #181713 !important;
}

.career-studio.cs-dark-v16 .cs-game-arena .cs-fighter--recruiter .cs-fighter-label,
.career-studio.cs-v14-dark .cs-game-arena .cs-fighter--recruiter .cs-fighter-label,
.career-studio.cs-dark-ui .cs-game-arena .cs-fighter--recruiter .cs-fighter-label {
    color: #4b211a !important;
    -webkit-text-fill-color: #4b211a !important;
    background: #fbe6df !important;
    border-color: #d79080 !important;
}


/* ===== career-studio-final-v19.css ===== */
/* Career Studio v19 — safe launch polish for support state and full preview. */
body.cs-preview-modal-open { overflow: hidden; }

.career-studio .cs-support-box.is-disabled .cs-support-amount,
.career-studio .cs-support-box.is-disabled .cs-support-input-wrap,
.career-studio .cs-support-box.is-disabled .cs-support-button {
    opacity: .72;
}

.career-studio .cs-support-box.is-disabled .cs-support-help,
.career-studio .cs-support-section[data-enabled="0"] .cs-support-status {
    color: #f4e6ae;
}

.career-studio .cs-support-box.is-disabled .cs-support-button:hover,
.career-studio .cs-support-box.is-disabled .cs-support-button:focus-visible {
    transform: none;
    color: #17130b;
    background: #e6c45e;
}

.career-studio .cs-preview-modal[hidden] { display: none; }
.career-studio .cs-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 10020;
    display: grid;
    place-items: center;
    padding: 24px;
}

.career-studio .cs-preview-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(12, 12, 10, .72);
    backdrop-filter: blur(6px);
}

.career-studio .cs-preview-modal-card {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    max-height: min(92vh, 980px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(225, 198, 115, .42);
    border-radius: 24px;
    background: linear-gradient(180deg, #181711 0%, #11100c 100%);
    box-shadow: 0 32px 90px rgba(0, 0, 0, .46);
}

.career-studio .cs-preview-modal-bar {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 18px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.career-studio .cs-preview-modal-bar .cs-eyebrow { margin-bottom: 6px; }
.career-studio .cs-preview-modal-bar h2 {
    margin: 0;
    color: #fffdf6;
    font-size: clamp(1.2rem, 2vw, 1.85rem);
    line-height: 1.08;
}

.career-studio .cs-preview-modal-stage {
    overflow: auto;
    padding: clamp(18px, 3vw, 34px);
    background: radial-gradient(circle at top, rgba(230, 196, 94, .12), transparent 28%), #151410;
}

.career-studio .cs-preview-modal-stage .cs-resume-sheet {
    width: min(210mm, 100%);
    min-height: 297mm;
    margin: 0 auto;
    padding: 16mm 15mm;
    border: 1px solid #d7cfbf;
    border-radius: 10px;
    color: #1a1815;
    background: #fff;
    box-shadow: 0 22px 60px rgba(0, 0, 0, .3);
}

@media (max-width: 780px) {
    .career-studio .cs-preview-modal {
        padding: 12px;
    }

    .career-studio .cs-preview-modal-card {
        max-height: 94vh;
        border-radius: 18px;
    }

    .career-studio .cs-preview-modal-bar {
        flex-direction: column;
        align-items: flex-start;
    }

    .career-studio .cs-preview-modal-bar .cs-button {
        width: 100%;
        justify-content: center;
    }

    .career-studio .cs-preview-modal-stage {
        padding: 14px;
    }

    .career-studio .cs-preview-modal-stage .cs-resume-sheet {
        min-height: auto;
        padding: 18px 16px;
    }
}
/* CAREER STUDIO FORM UNLOCK V20 */

/* Hide redundant local-phase banner, but keep its DOM for existing reset JS. */
.career-studio .cs-local-bar {
    display: none !important;
}

/* ===== Career Studio release surface ===== */
/*
 * GraphicBidu Career Studio v20 — release surface layer.
 * Loaded after career-studio-app.css. Replaces the stacked v9–v19 patch CSS.
 */

body.cs-preview-modal-open { overflow: hidden; }

/* Browser-local copy stays transparent in content/SEO, but the redundant banner is not shown. */
.career-studio .cs-local-bar[hidden] { display: none !important; }

/* Explicitly style file-picking buttons as real buttons; no label/hidden-input dependency. */
.career-studio .cs-file-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.career-studio #parseExistingResume:disabled {
    opacity: .56;
    cursor: not-allowed;
}

/* Keep resume output as paper in either site theme. */
.career-studio .cs-builder-toolbar {
    display: grid;
    grid-template-columns: minmax(170px, .65fr) minmax(360px, 1.35fr);
    align-items: center;
    gap: 16px 22px;
    padding: 18px;
    color: #171612;
    border-color: #d8cfae;
    background: linear-gradient(135deg, #fffef9 0%, #f8f0d9 100%);
}

.career-studio .cs-builder-toolbar :is(strong, p, .cs-toolbar-label) { color: #171612; }
.career-studio .cs-builder-toolbar .cs-toolbar-label { color: #765d09; }
.career-studio .cs-builder-toolbar .cs-toolbar-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
.career-studio .cs-builder-toolbar .cs-export-note,
.career-studio .cs-builder-toolbar .cs-export-detail {
    grid-column: 1 / -1;
    margin: 0;
    color: #625a4b;
}
.career-studio .cs-builder-toolbar .cs-button-primary {
    color: #fff;
    border-color: #171612;
    background: #171612;
}
.career-studio .cs-builder-toolbar .cs-button-secondary {
    color: #654e00;
    border-color: #b89b35;
    background: #fffdf6;
}

/* Template states are visible in both the selector and preview. */
.career-studio .cs-template-option.is-active {
    border-color: #b58b00;
    box-shadow: 0 0 0 2px rgba(181, 139, 0, .15), 0 10px 20px rgba(38, 28, 6, .09);
    background: #fffdf6;
}
.career-studio.cs-template-executive .cs-template-option.is-active { border-color: #222019; }
.career-studio.cs-template-modern .cs-template-option.is-active { border-color: #b58b00; }
.career-studio .cs-resume-sheet.cs-template-classic-v15 { border-top: 3px solid #25231f; }
.career-studio .cs-resume-sheet.cs-template-executive-v15 { border-left: 8px solid #25231f; }
.career-studio .cs-resume-sheet.cs-template-executive-v15 .cs-resume-header {
    padding: 13px 12px 12px 16px;
    margin-left: -8px;
    color: #fff;
    background: #25231f;
    border-bottom: 0;
}
.career-studio .cs-resume-sheet.cs-template-executive-v15 .cs-resume-header :is(.cs-resume-name, .cs-resume-role, .cs-resume-contact) { color: #fff !important; }
.career-studio .cs-resume-sheet.cs-template-modern-v15 { border-top: 8px solid #be920b; }
.career-studio .cs-resume-sheet.cs-template-modern-v15 .cs-resume-header { border-bottom-color: #be920b; }
.career-studio .cs-resume-sheet.cs-template-modern-v15 .cs-resume-name { color: #705600; }

/* In-page A4 preview modal. */
.career-studio .cs-preview-modal[hidden] { display: none; }
.career-studio .cs-preview-modal {
    position: fixed;
    inset: 0;
    z-index: 10020;
    display: grid;
    place-items: center;
    padding: 24px;
}
.career-studio .cs-preview-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(10, 10, 8, .74);
    backdrop-filter: blur(6px);
}
.career-studio .cs-preview-modal-card {
    position: relative;
    z-index: 1;
    width: min(100%, 1180px);
    max-height: min(92vh, 980px);
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(225, 198, 115, .42);
    border-radius: 22px;
    background: #151410;
    box-shadow: 0 32px 90px rgba(0, 0, 0, .46);
}
.career-studio .cs-preview-modal-bar {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    padding: 17px 22px;
    border-bottom: 1px solid rgba(255, 255, 255, .09);
}
.career-studio .cs-preview-modal-bar :is(h2, p, .cs-eyebrow) { color: #fffdf5; }
.career-studio .cs-preview-modal-stage {
    overflow: auto;
    padding: clamp(18px, 3vw, 34px);
    background: radial-gradient(circle at top, rgba(230, 196, 94, .12), transparent 30%), #151410;
}
.career-studio .cs-preview-modal-stage .cs-resume-sheet {
    width: min(210mm, 100%);
    min-height: 297mm;
    margin: 0 auto;
    padding: 16mm 15mm;
    border: 1px solid #d7cfbf;
    border-radius: 8px;
    color: #1a1815;
    background: #fff;
    box-shadow: 0 22px 60px rgba(0, 0, 0, .3);
}

/* Dark site state. Export and live resume remain white paper; the rest is legible dark UI. */
.career-studio.cs-theme-dark {
    --cs-ink: #f7f4e9;
    --cs-paper: #0b0f0c;
    --cs-panel: #151a16;
    --cs-muted: #b7c0b7;
    --cs-line: #344238;
    --cs-warm: #e1c24e;
    --cs-warm-dark: #f2d877;
    --cs-success: #7bd59b;
    --cs-danger: #ffaaa0;
    --cs-shadow: 0 22px 48px rgba(0, 0, 0, .46);
    color: var(--cs-ink);
    background: linear-gradient(180deg, #090d0a 0%, #111711 48%, #090d0a 100%);
}
.career-studio.cs-theme-dark :is(.cs-panel, .cs-insight-card, .cs-progress-wrap, .cs-import-resume, .cs-start-path, .cs-template-picker, .cs-form-section, .cs-repeat-card, .cs-photo-row, .cs-job-result, .cs-job-result-block, .cs-review-item, .cs-search-guide, .cs-faq details) {
    color: #f7f4e9;
    border-color: #344238;
    background: #151a16;
}
.career-studio.cs-theme-dark :is(h1, h2, h3, h4, strong, label, .cs-section-title h3) { color: #f7f4e9; }
.career-studio.cs-theme-dark :is(p, small, li, .cs-section-title p, .cs-panel-heading > div > p:last-child, .cs-photo-copy p, .cs-form-note, .cs-export-note, .cs-export-detail, .cs-crawl-note) { color: #b7c0b7; }
.career-studio.cs-theme-dark :is(input, textarea, select, .cs-answer-button) {
    color: #f7f4e9;
    border-color: #415044;
    background: #101610;
}
.career-studio.cs-theme-dark select { color-scheme: dark; }
.career-studio.cs-theme-dark select option { color: #f7f4e9; background: #101610; }
.career-studio.cs-theme-dark .cs-start-path-option,
.career-studio.cs-theme-dark .cs-template-option {
    color: #f7f4e9;
    border-color: #405046;
    background: linear-gradient(180deg, #1b241e, #141b16);
}
.career-studio.cs-theme-dark .cs-start-path-option small,
.career-studio.cs-theme-dark .cs-template-option small { color: #b7c0b7; }
.career-studio.cs-theme-dark .cs-start-path-option.is-active,
.career-studio.cs-theme-dark .cs-template-option.is-active {
    color: #201a0a;
    border-color: #efd469;
    background: #efd469;
}
.career-studio.cs-theme-dark .cs-start-path-option.is-active :is(strong, small),
.career-studio.cs-theme-dark .cs-template-option.is-active :is(strong, small) { color: #201a0a; }
.career-studio.cs-theme-dark .cs-preview-card,
.career-studio.cs-theme-dark .cs-resume-preview { background: #fff; }
.career-studio.cs-theme-dark .cs-preview-card :is(.cs-insight-heading, .cs-insight-heading strong) { color: #24221e; }
.career-studio.cs-theme-dark .cs-resume-preview :is(.cs-resume-name, .cs-resume-role, .cs-resume-contact, .cs-resume-section h4, .cs-resume-section p, .cs-resume-section li, .cs-preview-job strong, .cs-preview-job span, .cs-resume-link, .cs-resume-skills span) { color: inherit; }

/* Only the donation card is intentionally black-and-gold in either theme. */
.career-studio .cs-support-section {
    grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr);
    color: #fff;
    border-color: #83700e;
    background:
        radial-gradient(circle at 82% 18%, rgba(230, 196, 94, .22), transparent 32%),
        radial-gradient(circle at 13% 90%, rgba(152, 115, 0, .15), transparent 30%),
        #12120e;
}
.career-studio .cs-support-section :is(h2, h3, strong, .cs-eyebrow) { color: #fffdf6; }
.career-studio .cs-support-section :is(p, small, .cs-support-help, .cs-support-status) { color: rgba(255, 255, 255, .75); }
.career-studio .cs-support-box { background: rgba(255,255,255,.08); }
.career-studio .cs-support-amount { color: #fffdf6; }
.career-studio .cs-support-input-wrap input { color: #201a0a; background: #fffdf6; }
.career-studio .cs-support-input-wrap span { color: #201a0a; background: #ede2bc; }

.career-studio.cs-theme-dark .cs-builder-toolbar,
.career-studio.cs-theme-dark .cs-builder-toolbar :is(.cs-toolbar-label, strong, p) {
    color: #171612;
}

/* Recruiter Rush identity pills stay dark/readable in dark mode. */
.career-studio.cs-theme-dark .cs-fighter-label,
.career-studio.cs-theme-dark .cs-fighter--recruiter .cs-fighter-label {
    color: #2a2113;
    border-color: #d7b65a;
    background: #fff5d8;
}

@media (max-width: 820px) {
    .career-studio .cs-builder-toolbar {
        grid-template-columns: 1fr;
        padding: 16px;
    }
    .career-studio .cs-builder-toolbar .cs-toolbar-actions { justify-content: flex-start; }
    .career-studio .cs-support-section {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 24px 18px;
    }
    .career-studio .cs-support-box { width: 100%; }
    .career-studio .cs-support-section,
    .career-studio .cs-support-section > .cs-support-copy,
    .career-studio .cs-support-section > .cs-support-box {
        min-width: 0;
    }
    .career-studio .cs-support-section :is(.cs-eyebrow, h2, p, .cs-support-fineprint) {
        max-width: 100%;
        word-break: normal;
        overflow-wrap: break-word;
        white-space: normal;
    }
}

@media (max-width: 780px) {
    .career-studio .cs-preview-modal { padding: 12px; }
    .career-studio .cs-preview-modal-card { max-height: 94vh; border-radius: 18px; }
    .career-studio .cs-preview-modal-bar { flex-direction: column; align-items: flex-start; }
    .career-studio .cs-preview-modal-stage { padding: 14px; }
    .career-studio .cs-preview-modal-stage .cs-resume-sheet { min-height: auto; padding: 18px 16px; }
}
/* Career Studio viewport and dark surface contrast */
.career-studio.cs-theme-dark .cs-premium-value-strip {
    border-color: #344238;
    background: #344238;
}

.career-studio.cs-theme-dark .cs-premium-value-strip > div {
    background: #151a16;
}

.career-studio.cs-theme-dark .cs-premium-value-strip strong {
    color: #f7f4e9;
}

.career-studio.cs-theme-dark .cs-premium-value-strip span {
    color: #b7c0b7;
}

@media (max-width: 780px) {
    .site-header.launch-header .launch-header-shell,
    .site-header.launch-header .launch-brand,
    .site-header.launch-header .launch-header-right,
    .site-header.launch-header .launch-mobile-auth-shortcuts,
    .career-studio,
    .career-studio .cs-shell,
    .career-studio .cs-hero,
    .career-studio .cs-hero-main,
    .career-studio .cs-truth-card,
    .career-studio .cs-premium-value-strip,
    .career-studio .cs-launch-workflow,
    .career-studio .cs-progress-wrap,
    .career-studio .cs-grid,
    .career-studio .cs-workspace,
    .career-studio .cs-insights,
    .career-studio .cs-panel,
    .career-studio .cs-preview-card {
        min-width: 0;
        max-width: 100%;
    }

    .career-studio .cs-hero h1 {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .career-studio .cs-premium-value-strip {
        grid-template-columns: 1fr;
    }

    .career-studio .cs-premium-value-strip > div {
        padding: 14px 16px;
    }
}

@media (max-width: 480px) {
    .site-header.launch-header .launch-header-shell {
        width: min(calc(100% - 24px), var(--gb-max)) !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 6px !important;
        min-width: 0 !important;
    }

    .site-header.launch-header .launch-brand {
        gap: 7px !important;
        min-width: 0 !important;
    }

    .site-header.launch-header .brand-logo {
        height: 28px !important;
        max-width: 32px !important;
    }

    .site-header.launch-header .brand-text {
        font-size: 13px !important;
    }

    .site-header.launch-header .launch-header-right {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
    }

    .site-header.launch-header .desktop-theme-toggle,
    .site-header.launch-header .launch-mobile-auth-link {
        display: none !important;
    }

    .site-header.launch-header .launch-mobile-auth-shortcuts {
        display: flex !important;
        gap: 0 !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
    }

    .site-header.launch-header .launch-mobile-auth-pill {
        display: inline-flex !important;
        min-height: 34px !important;
        max-width: 112px !important;
        padding: 0 8px !important;
        overflow: hidden !important;
        font-size: 11px !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
    }

    .site-header.launch-header .launch-nav-toggle {
        display: inline-flex !important;
        flex: 0 0 36px !important;
        width: 36px !important;
        height: 36px !important;
    }

    .career-studio .cs-hero h1 {
        max-width: 100% !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        font-size: clamp(2.1rem, 9.2vw, 2.45rem) !important;
        line-height: .98 !important;
        letter-spacing: -.058em !important;
    }

    .career-studio .cs-hero-copy {
        font-size: .98rem !important;
        line-height: 1.55 !important;
    }
}


/* Career Studio native picker and FAQ rebuild */
.career-studio .cs-import-actions,
.career-studio .cs-photo-actions,
.career-studio .cs-faq-rebuild {
    position: relative;
    z-index: 5;
    pointer-events: auto;
}

.career-studio .cs-native-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    border: 0;
    white-space: nowrap;
}

.career-studio label.cs-file-button {
    cursor: pointer;
    user-select: none;
}

.career-studio label.cs-file-button:focus-visible,
.career-studio .cs-faq-trigger:focus-visible {
    outline: 3px solid rgba(188, 146, 11, .48);
    outline-offset: 3px;
}

.career-studio .cs-faq-rebuild {
    display: grid;
    gap: 9px;
    margin-top: 24px;
}

.career-studio .cs-faq-rebuild .cs-faq-item {
    overflow: hidden;
    border: 1px solid #e0d7c8;
    border-radius: 11px;
    background: #fffefa;
}

.career-studio .cs-faq-rebuild .cs-faq-trigger {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 16px;
    border: 0;
    color: #252119;
    background: transparent;
    cursor: pointer;
    font: inherit;
    font-size: .91rem;
    font-weight: 830;
    text-align: left;
}

.career-studio .cs-faq-rebuild .cs-faq-symbol {
    display: inline-grid;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    place-items: center;
    border: 1px solid #d7c878;
    border-radius: 999px;
    color: #6a5200;
    background: #fff8d6;
    font-size: 1.1rem;
    line-height: 1;
}

.career-studio .cs-faq-rebuild .cs-faq-answer {
    padding: 0 16px 15px;
}

.career-studio .cs-faq-rebuild .cs-faq-answer[hidden] {
    display: none !important;
}

.career-studio .cs-faq-rebuild .cs-faq-answer p {
    margin: 0;
    color: var(--cs-muted);
    font-size: .87rem;
    line-height: 1.55;
}

.career-studio.cs-theme-dark .cs-faq-rebuild .cs-faq-item {
    border-color: #344238;
    background: #151a16;
}

.career-studio.cs-theme-dark .cs-faq-rebuild .cs-faq-trigger {
    color: #f7f4e9;
}

.career-studio.cs-theme-dark .cs-faq-rebuild .cs-faq-answer p {
    color: #b7c0b7;
}

.career-studio.cs-theme-dark .cs-faq-rebuild .cs-faq-symbol {
    border-color: #816e22;
    color: #f5dc7c;
    background: #202618;
}

/* Career Studio paste-import and target-role rebuild */
.career-studio .cs-paste-import-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 14px;
}

.career-studio .cs-paste-resume-field {
    display: grid;
    gap: 7px;
}

.career-studio #resumePasteText {
    width: 100%;
    min-height: 116px;
    resize: vertical;
}

.career-studio .cs-paste-import-status {
    min-height: 20px;
    margin: 9px 0 0;
    color: var(--cs-muted);
    font-size: .82rem;
}

.career-studio .cs-paste-import-status.is-error {
    color: #9e2d20;
}

.career-studio .cs-photo-upload-note {
    max-width: 560px;
    margin: 0;
    color: var(--cs-muted);
    font-size: .88rem;
    line-height: 1.55;
}

.career-studio #targetRole {
    display: block;
    width: 100%;
    margin-top: 8px;
}

.career-studio.cs-theme-dark .cs-paste-import-status.is-error {
    color: #ffad9f;
}

@media (max-width: 780px) {
    .career-studio .cs-paste-import-actions {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .career-studio .cs-paste-import-actions #parsePastedResume {
        width: 100%;
    }
}

/* Career Studio direct native upload controls final */
.career-studio .cs-direct-native-upload-actions,
.career-studio .cs-direct-native-photo-actions {
    position: relative;
    z-index: 500 !important;
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 12px;
    isolation: isolate;
    pointer-events: auto !important;
}

.career-studio .cs-direct-native-upload-field {
    display: grid;
    min-width: 280px;
    gap: 7px;
    margin: 0;
    color: #252119;
    font-size: .8rem;
    font-weight: 850;
    pointer-events: auto !important;
}

.career-studio .cs-direct-native-upload-label {
    display: block;
}

.career-studio .cs-direct-native-upload-input {
    position: static !important;
    z-index: auto !important;
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    min-width: 280px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 5px 7px !important;
    overflow: visible !important;
    opacity: 1 !important;
    clip: auto !important;
    clip-path: none !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    color: #252119 !important;
    border: 1px solid #c8b96f !important;
    border-radius: 10px !important;
    background: #fffefa !important;
    font: inherit !important;
}

.career-studio .cs-direct-native-upload-input::file-selector-button {
    min-height: 33px;
    margin-right: 10px;
    padding: 0 13px;
    color: #fff;
    border: 1px solid #171612;
    border-radius: 7px;
    background: #171612;
    cursor: pointer;
    font: inherit;
    font-weight: 850;
}

.career-studio .cs-direct-native-upload-input:hover::file-selector-button {
    background: #403719;
}

.career-studio .cs-direct-native-upload-input:focus-visible {
    outline: 3px solid rgba(188, 146, 11, .48);
    outline-offset: 3px;
}

.career-studio.cs-theme-dark .cs-direct-native-upload-field {
    color: #f7f4e9;
}

.career-studio.cs-theme-dark .cs-direct-native-upload-input {
    color: #f7f4e9 !important;
    border-color: #816e22 !important;
    background: #151a16 !important;
}

@media (max-width: 780px) {
    .career-studio .cs-direct-native-upload-actions,
    .career-studio .cs-direct-native-photo-actions {
        align-items: stretch;
    }

    .career-studio .cs-direct-native-upload-field,
    .career-studio .cs-direct-native-upload-input,
    .career-studio .cs-direct-native-upload-actions #parseExistingResume {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Career Studio upload and photo UI removed */
.career-studio #resume-import[hidden],
.career-studio .cs-photo-row[hidden] {
    display: none !important;
}

/* Career Studio core product restoration v4 */
.career-studio,
.career-studio.cs-light-ui {
    --cs-page: #f7f5f0;
    --cs-surface: #ffffff;
    --cs-soft: #faf9f6;
    --cs-ink: #181714;
    --cs-muted: #68645d;
    --cs-line: #e5dfd4;
    --cs-line-strong: #d2c7b8;
    --cs-gold: #b88928;
    --cs-navy: #17263b;
    --cs-shadow: 0 14px 34px rgba(32, 27, 19, .07);

    color: var(--cs-ink) !important;
    background:
        radial-gradient(circle at 7% 2%, rgba(201, 162, 73, .10), transparent 24rem),
        var(--cs-page) !important;
}

.career-studio.cs-theme-dark,
.career-studio.cs-dark-ui,
html.dark .career-studio,
body.dark .career-studio,
html[data-theme="dark"] .career-studio,
body[data-theme="dark"] .career-studio {
    --cs-page: #0e141d;
    --cs-surface: #151f2c;
    --cs-soft: #1a2736;
    --cs-ink: #f7f4ee;
    --cs-muted: #abb4c0;
    --cs-line: #2f3c4d;
    --cs-line-strong: #43536a;
    --cs-gold: #e3b953;
    --cs-navy: #e3b953;
    --cs-shadow: 0 18px 44px rgba(0, 0, 0, .30);

    color-scheme: dark;
    background:
        radial-gradient(circle at 7% 2%, rgba(227, 185, 83, .10), transparent 24rem),
        var(--cs-page) !important;
}

.career-studio {
    padding: 0 0 72px !important;
}

.career-studio .cs-shell {
    width: min(1180px, calc(100% - 48px)) !important;
}

.career-studio .cs-hero {
    min-height: 0 !important;
    padding: 48px 0 24px !important;
}

.career-studio .cs-hero h1,
.career-studio .cs-panel-heading h2,
.career-studio .cs-search-guide h2 {
    color: var(--cs-ink) !important;
    letter-spacing: -.045em !important;
}

.career-studio .cs-hero-copy,
.career-studio .cs-panel-heading p,
.career-studio .cs-section-title p,
.career-studio .cs-search-guide p {
    color: var(--cs-muted) !important;
}

.career-studio .cs-truth-card,
.career-studio .cs-premium-value-strip,
.career-studio .cs-launch-workflow {
    display: none !important;
}

.career-studio .cs-grid {
    grid-template-columns: minmax(0, 1fr) 360px !important;
    gap: 28px !important;
    align-items: start !important;
}

.career-studio .cs-insights {
    position: sticky !important;
    top: 18px !important;
    gap: 12px !important;
}

.career-studio .cs-panel,
.career-studio .cs-preview-card,
.career-studio .cs-score-card,
.career-studio .cs-insight-card,
.career-studio .cs-support-section,
.career-studio .cs-search-guide {
    border: 1px solid var(--cs-line) !important;
    border-radius: 16px !important;
    background: var(--cs-surface) !important;
    box-shadow: var(--cs-shadow) !important;
}

.career-studio .cs-panel {
    padding: 30px !important;
}

.career-studio .cs-panel-heading {
    padding-bottom: 20px !important;
    margin-bottom: 20px !important;
    border-bottom: 1px solid var(--cs-line) !important;
}

.career-studio .cs-form-section {
    padding: 24px 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid var(--cs-line) !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.career-studio .cs-form-section:last-of-type {
    border-bottom: 0 !important;
}

.career-studio .cs-start-path,
.career-studio .cs-template-picker {
    border-color: var(--cs-line) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.career-studio .cs-import-resume {
    display: block !important;
    margin: 0 0 22px !important;
    padding: 20px !important;
    border: 1px solid color-mix(in srgb, var(--cs-gold) 42%, var(--cs-line)) !important;
    border-radius: 13px !important;
    background: color-mix(in srgb, var(--cs-gold) 7%, var(--cs-surface)) !important;
    pointer-events: auto !important;
}

.career-studio .cs-import-resume[hidden],
.career-studio .cs-photo-row[hidden] {
    display: grid !important;
}

.career-studio .cs-import-resume-grid {
    gap: 20px !important;
    align-items: center !important;
}

.career-studio .cs-import-actions,
.career-studio .cs-photo-actions {
    position: relative !important;
    z-index: 20 !important;
    display: grid !important;
    gap: 10px !important;
    pointer-events: auto !important;
}

.career-studio .cs-direct-file-control {
    display: grid !important;
    gap: 7px !important;
    margin: 0 !important;
    color: var(--cs-ink) !important;
    font-size: .76rem !important;
    font-weight: 850 !important;
}

.career-studio .cs-direct-file-input {
    position: relative !important;
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    min-height: 44px !important;
    padding: 5px 7px !important;
    opacity: 1 !important;
    clip: auto !important;
    clip-path: none !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    color: var(--cs-ink) !important;
    border: 1px solid var(--cs-line-strong) !important;
    border-radius: 8px !important;
    background: var(--cs-surface) !important;
    font: inherit !important;
}

.career-studio .cs-direct-file-input::file-selector-button {
    min-height: 31px !important;
    margin-right: 9px !important;
    padding: 0 11px !important;
    color: #fff !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: var(--cs-navy) !important;
    cursor: pointer !important;
    font: inherit !important;
    font-weight: 850 !important;
}

.career-studio.cs-theme-dark .cs-direct-file-input,
.career-studio.cs-dark-ui .cs-direct-file-input {
    color-scheme: dark;
    background: #101a27 !important;
}

.career-studio .cs-photo-row {
    display: grid !important;
    grid-template-columns: 88px minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 16px !important;
    margin-bottom: 18px !important;
    border: 1px solid var(--cs-line) !important;
    border-radius: 12px !important;
    background: var(--cs-soft) !important;
}

.career-studio .cs-photo-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: end !important;
}

.career-studio .cs-direct-photo-control {
    min-width: 245px !important;
}

.career-studio .cs-checkbox-line {
    color: var(--cs-muted) !important;
}

.career-studio :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    color: var(--cs-ink) !important;
    border-color: var(--cs-line-strong) !important;
    background: var(--cs-surface) !important;
}

.career-studio.cs-theme-dark :is(input, select, textarea),
.career-studio.cs-dark-ui :is(input, select, textarea) {
    color-scheme: dark;
    background: #101a27 !important;
}

.career-studio .cs-resume-branding {
    display: block !important;
    margin-top: 24px !important;
    padding-top: 10px !important;
    color: #777166 !important;
    border-top: 1px solid #e2ddd4 !important;
    font-size: .72rem !important;
    line-height: 1.4 !important;
    text-align: center !important;
}

.career-studio .cs-support-section {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 390px) !important;
    gap: 34px !important;
    align-items: center !important;
    padding: 30px !important;
    margin-top: 28px !important;
    color: var(--cs-ink) !important;
}

.career-studio .cs-support-section h2,
.career-studio .cs-support-section p,
.career-studio .cs-support-custom-label,
.career-studio .cs-support-help {
    color: inherit !important;
}

.career-studio .cs-support-box {
    padding: 16px !important;
    border: 1px solid var(--cs-line) !important;
    border-radius: 12px !important;
    background: var(--cs-soft) !important;
}

.career-studio .cs-support-amount {
    color: var(--cs-ink) !important;
    border-color: var(--cs-line-strong) !important;
    background: var(--cs-surface) !important;
}

.career-studio .cs-support-amount.is-active {
    color: #fff !important;
    border-color: var(--cs-navy) !important;
    background: var(--cs-navy) !important;
}

.career-studio .cs-support-input-wrap {
    border-color: var(--cs-line-strong) !important;
    background: var(--cs-surface) !important;
}

.career-studio .cs-search-guide {
    padding: 30px !important;
    margin-top: 28px !important;
}

@media (max-width: 1020px) {
    .career-studio .cs-grid,
    .career-studio .cs-support-section {
        grid-template-columns: 1fr !important;
    }

    .career-studio .cs-insights {
        position: static !important;
    }
}

@media (max-width: 720px) {
    .career-studio .cs-shell {
        width: min(100% - 28px, 640px) !important;
    }

    .career-studio .cs-panel,
    .career-studio .cs-search-guide,
    .career-studio .cs-support-section {
        padding: 20px !important;
    }

    .career-studio .cs-photo-row {
        grid-template-columns: 1fr !important;
    }

    .career-studio .cs-direct-photo-control {
        min-width: 0 !important;
        width: 100% !important;
    }
}

/* Career Studio final clean export repair styles v3 */
.career-studio .cs-export-stack {
    display: grid;
    gap: 9px;
}

.career-studio .cs-free-export-actions {
    grid-template-columns: 1fr 1fr !important;
    gap: 8px !important;
    margin: 0 !important;
}

.career-studio .cs-free-export-actions .cs-button {
    display: grid !important;
    min-height: 55px !important;
    gap: 3px !important;
    padding: 9px 10px !important;
    text-align: center !important;
}

.career-studio .cs-free-export-actions strong {
    font-size: .82rem;
}

.career-studio .cs-free-export-actions span {
    opacity: .7;
    font-size: .61rem;
    font-weight: 700;
}

.career-studio .cs-clean-export-gate {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 56px;
    padding: 10px 12px;
    color: var(--cs-ink);
    border: 1px solid color-mix(in srgb, var(--cs-gold) 64%, var(--cs-line));
    border-radius: 10px;
    background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--cs-gold) 16%, var(--cs-surface)),
        color-mix(in srgb, var(--cs-gold) 5%, var(--cs-surface))
    );
    cursor: pointer;
    text-align: left;
}

.career-studio .cs-clean-export-gate:hover {
    border-color: var(--cs-gold);
    background: color-mix(in srgb, var(--cs-gold) 21%, var(--cs-surface));
}

.career-studio .cs-clean-export-gate-icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 31px;
    height: 31px;
    color: #392b0d;
    border-radius: 8px;
    background: var(--cs-gold);
    font-size: .95rem;
}

.career-studio .cs-clean-export-gate strong,
.career-studio .cs-clean-export-gate small {
    display: block;
}

.career-studio .cs-clean-export-gate strong {
    font-size: .76rem;
}

.career-studio .cs-clean-export-gate small {
    margin-top: 2px;
    color: var(--cs-muted);
    font-size: .63rem;
}

.career-studio .cs-clean-download-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.career-studio .cs-clean-download-actions[hidden] {
    display: none !important;
}

.career-studio .cs-clean-download-actions .cs-button {
    min-height: 43px !important;
    font-size: .72rem !important;
}

.career-studio .cs-clean-export-note {
    margin: 1px 2px 0 !important;
    color: var(--cs-muted) !important;
    font-size: .65rem !important;
    line-height: 1.42 !important;
    text-align: center !important;
}

.career-studio .cs-clean-export-note.is-unlocked {
    color: color-mix(in srgb, var(--cs-gold) 70%, var(--cs-ink)) !important;
    font-weight: 800 !important;
}

.career-studio .cs-branding-drawer-backdrop {
    position: fixed;
    z-index: 2147482000;
    inset: 0;
    background: rgba(7, 11, 18, .70);
    backdrop-filter: blur(4px);
}

.career-studio .cs-branding-drawer-backdrop[hidden] {
    display: none !important;
}

.career-studio #support-graphicbidu {
    display: none !important;
}

.career-studio #support-graphicbidu.is-branding-drawer-open {
    position: fixed !important;
    z-index: 2147482001 !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: min(500px, calc(100vw - 32px)) !important;
    max-height: min(720px, calc(100vh - 32px)) !important;
    overflow-y: auto !important;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
    padding: 28px !important;
    margin: 0 !important;
    border: 1px solid color-mix(in srgb, var(--cs-gold) 48%, var(--cs-line)) !important;
    border-radius: 18px !important;
    background: var(--cs-surface) !important;
    box-shadow: 0 28px 88px rgba(0, 0, 0, .38) !important;
}

body.cs-branding-drawer-active {
    overflow: hidden !important;
}

.career-studio .cs-branding-drawer-close {
    position: absolute;
    top: 12px;
    right: 13px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    padding: 0;
    color: var(--cs-muted);
    border: 1px solid var(--cs-line);
    border-radius: 9px;
    background: var(--cs-soft);
    cursor: pointer;
    font-size: 1.2rem;
}

.career-studio .cs-branding-drawer-close:hover {
    color: var(--cs-ink);
    border-color: var(--cs-gold);
}

.career-studio #support-graphicbidu.is-branding-drawer-open .cs-support-copy {
    padding-right: 36px;
}

.career-studio #support-graphicbidu.is-branding-drawer-open .cs-support-copy h2 {
    max-width: 390px;
}

.career-studio #support-graphicbidu.is-branding-drawer-open .cs-support-box {
    width: 100%;
}

@media (max-width: 560px) {
    .career-studio .cs-clean-download-actions {
        grid-template-columns: 1fr;
    }

    .career-studio #support-graphicbidu.is-branding-drawer-open {
        width: calc(100vw - 22px) !important;
        max-height: calc(100vh - 22px) !important;
        padding: 21px !important;
    }
}