/* ==========================================================================
   AI CV Builder: job match experience (area E). Loaded after cv_builder.css.
   Built on the studio tokens (--studio-*) so it follows whatever theme the shell uses.
   Status is never colour alone: every status has an icon and a word.
   ========================================================================== */

.cvm-ws {
    --cvm-ink: var(--studio-ink, #e5e7eb);
    --cvm-muted: var(--studio-muted, #9ca3af);
    --cvm-line: var(--studio-border, rgba(255, 255, 255, 0.1));
    --cvm-line-strong: var(--studio-border-strong, rgba(255, 255, 255, 0.2));
    --cvm-card: rgba(255, 255, 255, 0.035);
    --cvm-card-2: rgba(255, 255, 255, 0.06);
    --cvm-accent: var(--studio-accent-strong, #a855f7);
    --cvm-accent-2: var(--studio-accent, #4f46e5);
    --cvm-ok: #34d399;
    --cvm-partial: #fbbf24;
    --cvm-listed: #7dd3fc;
    --cvm-missing: #fb7185;
    --cvm-focus: #c4b5fd;
    --cvm-r: 14px;
}

/* ---- the workspace lives inline in the Job match tab (mount "tools-top") ---- */
.cvm-ws {
    display: block; width: 100%; color: var(--cvm-ink); font-size: 0.97rem; line-height: 1.55;
    padding: 1.3rem 1.4rem 1.5rem; border: 1px solid var(--cvm-line); border-radius: var(--studio-radius-xl, 20px);
    background: var(--studio-surface, rgba(255, 255, 255, 0.04)); box-shadow: var(--studio-shadow, none);
}
.cvm-head { display: grid; gap: 0.35rem; margin-bottom: 0.4rem; }
.cvm-head h2 { font-size: 1.5rem; line-height: 1.2; letter-spacing: -0.02em; }
.cvm-ws * { box-sizing: border-box; }
.cvm-ws :focus-visible { outline: 2px solid var(--cvm-focus); outline-offset: 2px; border-radius: 6px; }
.cvm-ws h2, .cvm-ws h3, .cvm-ws h4, .cvm-ws h5 { margin: 0; letter-spacing: -0.01em; color: var(--cvm-ink); }
.cvm-ws h3 { font-size: 1.25rem; }
.cvm-ws h4 { font-size: 1.02rem; }
.cvm-ws h5 { font-size: 1rem; font-weight: 650; }
.cvm-ws p { margin: 0; }
.cvm-muted { color: var(--cvm-muted); }
.cvm-fine { font-size: 0.84rem; }
.cvm-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cvm-eyebrow { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #c4b5fd; }
.cvm-row { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.cvm-wide { width: 100%; justify-content: center; }
.cvm-small { padding: 0.45rem 0.8rem !important; font-size: 0.88rem !important; }
.cvm-count { display: inline-block; min-width: 1.5rem; padding: 0.05rem 0.45rem; border-radius: 999px; background: var(--cvm-card-2); font-size: 0.78rem; font-weight: 600; color: var(--cvm-muted); text-align: center; }

/* ---- tabs ---- */
.cvm-tabs {
    display: flex; flex-wrap: wrap; gap: 0.35rem;      /* wraps at any width: no clipping, no hidden scroll, focus rings never cut off */
    padding: 0.7rem 0.15rem 0.7rem; margin: 0 0 0.9rem;
    border-bottom: 1px solid var(--cvm-line);
}
.cvm-tab {
    flex: 0 1 auto; display: inline-flex; align-items: center; gap: 0.45rem;
    padding: 0.55rem 0.85rem; border-radius: 999px; border: 1px solid transparent;
    background: transparent; color: var(--cvm-muted); font: inherit; font-weight: 600; font-size: 0.92rem; cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.cvm-tab:hover { color: var(--cvm-ink); background: var(--cvm-card-2); }
.cvm-tab.is-on { color: #fff; background: rgba(79, 70, 229, 0.28); border-color: rgba(167, 139, 250, 0.45); }
.cvm-tab-n { display: inline-grid; place-items: center; width: 1.35rem; height: 1.35rem; border-radius: 50%; font-size: 0.74rem; background: var(--cvm-card-2); }
.cvm-tab.is-on .cvm-tab-n { background: rgba(255, 255, 255, 0.2); }
.cvm-tab-badge { padding: 0.02rem 0.45rem; border-radius: 999px; font-size: 0.74rem; background: rgba(255, 255, 255, 0.12); color: var(--cvm-ink); }
.cvm-tab .fas { font-size: 0.85rem; opacity: 0.85; }

/* ---- generic blocks ---- */
.cvm-view { display: grid; gap: 1.1rem; }
.cvm-intro { display: grid; gap: 0.5rem; max-width: 62ch; }
.cvm-intro p { color: var(--cvm-muted); }
.cvm-card, .cvm-block, .cvm-group {
    border: 1px solid var(--cvm-line); border-radius: var(--cvm-r); background: var(--cvm-card); padding: 1rem 1.1rem; display: grid; gap: 0.7rem;
}
.cvm-card-soft { background: rgba(255, 255, 255, 0.02); }
.cvm-card-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; flex-wrap: wrap; }
.cvm-group { background: transparent; border: 0; padding: 0; gap: 0.6rem; }
.cvm-group > h4 { display: flex; gap: 0.5rem; align-items: center; }
.cvm-empty { display: grid; gap: 0.8rem; justify-items: start; padding: 1.4rem; border: 1px dashed var(--cvm-line-strong); border-radius: var(--cvm-r); color: var(--cvm-muted); }
.cvm-empty-line { color: var(--cvm-muted); font-style: italic; }
.cvm-panel:focus { outline: none; }
.cvm-details { border: 1px solid var(--cvm-line); border-radius: 10px; padding: 0.55rem 0.8rem; background: rgba(255, 255, 255, 0.02); }
.cvm-details > summary { cursor: pointer; font-weight: 600; font-size: 0.92rem; color: var(--cvm-ink); }
.cvm-details[open] > summary { margin-bottom: 0.5rem; }
.cvm-details-sm { padding: 0.35rem 0.65rem; }
.cvm-details-sm > summary { font-size: 0.84rem; font-weight: 550; color: var(--cvm-muted); }
.cvm-bullets { margin: 0; padding-left: 1.15rem; display: grid; gap: 0.3rem; }
.cvm-context { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.3rem; font-size: 0.9rem; color: var(--cvm-muted); }
.cvm-context li.is-hit { color: var(--cvm-ink); font-weight: 600; }
.cvm-linkbtn, .cvm-linklike { background: none; border: 0; padding: 0; font: inherit; color: #c4b5fd; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; text-align: left; }
.cvm-linkbtn:hover, .cvm-linklike:hover { color: #fff; }

/* ---- notices (honest, calm) ---- */
.cvm-notice { display: grid; gap: 0.35rem; padding: 0.85rem 1rem; border-radius: 12px; border: 1px solid var(--cvm-line-strong); background: var(--cvm-card-2); }
.cvm-notice-title { font-weight: 650; }
.cvm-notice-info { border-color: color-mix(in srgb, var(--cvm-listed) 40%, transparent); background: color-mix(in srgb, var(--cvm-listed) 9%, transparent); }
.cvm-notice-warn { border-color: color-mix(in srgb, var(--cvm-partial) 50%, transparent); background: color-mix(in srgb, var(--cvm-partial) 10%, transparent); }
.cvm-notice-ok { border-color: color-mix(in srgb, var(--cvm-ok) 45%, transparent); background: color-mix(in srgb, var(--cvm-ok) 9%, transparent); }
.cvm-notice-line, .cvm-warn-line, .cvm-ok-line { display: flex; gap: 0.45rem; align-items: baseline; font-size: 0.92rem; }
.cvm-warn-line { color: var(--cvm-partial); }
.cvm-ok-line { color: var(--cvm-ok); }
.cvm-quote-list { margin: 0; padding-left: 1.1rem; display: grid; gap: 0.3rem; font-size: 0.9rem; color: var(--cvm-muted); }

/* ---- chips ---- */
.cvm-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.cvm-chip { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.2rem 0.6rem; border-radius: 999px; background: var(--cvm-card-2); font-size: 0.82rem; color: var(--cvm-ink); border: 1px solid transparent; }
.cvm-chips-sm .cvm-chip { font-size: 0.76rem; padding: 0.12rem 0.5rem; }
.cvm-chip-quiet { color: var(--cvm-muted); background: transparent; border-color: var(--cvm-line); }
.cvm-chip-kw { background: rgba(125, 211, 252, 0.1); color: var(--cvm-listed); }
.cvm-chip-ok { background: color-mix(in srgb, var(--cvm-ok) 14%, transparent); color: var(--cvm-ok); }
.cvm-chip-warn { background: color-mix(in srgb, var(--cvm-partial) 14%, transparent); color: var(--cvm-partial); }
.cvm-chip-edit { background: rgba(167, 139, 250, 0.16); color: #ddd6fe; }
.cvm-chip-dashed { border: 1px dashed var(--cvm-listed); color: var(--cvm-listed); background: transparent; }
.cvm-chip.is-removed { text-decoration: line-through; }

/* ---- form controls ---- */
.cvm-field { display: grid; gap: 0.4rem; }
.cvm-label { font-weight: 650; font-size: 0.9rem; }
.cvm-ws textarea, .cvm-ws input[type="text"], .cvm-ws select {
    width: 100%; padding: 0.7rem 0.85rem; border-radius: 12px; border: 1px solid var(--cvm-line-strong);
    background: rgba(0, 0, 0, 0.22); color: var(--cvm-ink); font: inherit; line-height: 1.5;
}
.cvm-ws select { width: auto; padding: 0.4rem 0.6rem; border-radius: 10px; }
.cvm-ws textarea { resize: vertical; min-height: 5rem; }
.cvm-ws textarea:focus, .cvm-ws input[type="text"]:focus, .cvm-ws select:focus { outline: 2px solid var(--cvm-focus); outline-offset: 1px; border-color: transparent; }
.cvm-counter { font-size: 0.82rem; color: var(--cvm-muted); }
.cvm-counter.is-over { color: var(--cvm-partial); }
.cvm-file { position: absolute; width: 1px; height: 1px; opacity: 0; }
.cvm-file:focus-visible + * { outline: 2px solid var(--cvm-focus); }
.cvm-drop { display: grid; gap: 0.4rem; justify-items: center; text-align: center; padding: 1.8rem 1rem; border: 2px dashed var(--cvm-line-strong); border-radius: var(--cvm-r); color: var(--cvm-muted); transition: border-color 0.15s, background-color 0.15s; }
.cvm-drop .fas { font-size: 1.6rem; color: #c4b5fd; }
.cvm-drop.is-over { border-color: var(--cvm-focus); background: rgba(167, 139, 250, 0.08); }
.cvm-seg { display: inline-flex; flex-wrap: wrap; gap: 0.3rem; padding: 0.25rem; border-radius: 999px; background: var(--cvm-card-2); width: fit-content; max-width: 100%; }
.cvm-seg-btn { display: inline-flex; gap: 0.4rem; align-items: center; padding: 0.45rem 0.9rem; border-radius: 999px; border: 0; background: transparent; color: var(--cvm-muted); font: inherit; font-weight: 600; font-size: 0.9rem; cursor: pointer; }
.cvm-seg-btn.is-on { background: rgba(79, 70, 229, 0.4); color: #fff; }
.cvm-check, .cvm-consent { display: flex; gap: 0.6rem; align-items: flex-start; font-size: 0.92rem; cursor: pointer; }
.cvm-check input, .cvm-consent input { margin-top: 0.3rem; flex: 0 0 auto; width: 1.05rem; height: 1.05rem; accent-color: var(--cvm-accent-2); }
.cvm-consent { padding: 0.8rem 1rem; border: 1px solid var(--cvm-line); border-radius: 12px; background: var(--cvm-card); }
.cvm-inline { display: inline-flex; gap: 0.5rem; align-items: center; font-size: 0.9rem; }
.cvm-actions { display: grid; gap: 0.5rem; justify-items: start; padding-top: 0.2rem; }
.cvm-next { display: flex; }

/* ---- progress ---- */
.cvm-strip { display: grid; gap: 0.7rem; margin: 0 0 1rem; padding: 0.9rem 1rem; border: 1px solid var(--cvm-line-strong); border-radius: var(--cvm-r); background: var(--cvm-card-2); }
.cvm-progress { display: grid; gap: 0.4rem; }
.cvm-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0.6rem; }
.cvm-step { display: flex; gap: 0.6rem; align-items: flex-start; opacity: 0.6; }
.cvm-step.is-active, .cvm-step.is-done, .cvm-step.is-failed { opacity: 1; }
.cvm-step-dot { flex: 0 0 auto; display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 2px solid var(--cvm-line-strong); font-size: 0.7rem; }
.cvm-step.is-done .cvm-step-dot { background: var(--cvm-ok); border-color: var(--cvm-ok); color: #052e22; }
.cvm-step.is-failed .cvm-step-dot { background: var(--cvm-missing); border-color: var(--cvm-missing); color: #3b0612; }
.cvm-step.is-active .cvm-step-dot { border-color: var(--cvm-focus); }
.cvm-spin { width: 0.7rem; height: 0.7rem; border-radius: 50%; border: 2px solid var(--cvm-focus); border-right-color: transparent; animation: cvm-spin 0.9s linear infinite; }
@keyframes cvm-spin { to { transform: rotate(360deg); } }
.cvm-step-body { display: grid; line-height: 1.3; }
.cvm-step-label { font-weight: 650; font-size: 0.92rem; }
.cvm-step-note { font-size: 0.8rem; color: var(--cvm-muted); }

/* ---- requirements (understanding) ---- */
.cvm-reqs { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.55rem; }
.cvm-req { display: flex; gap: 0.8rem; justify-content: space-between; align-items: flex-start; padding: 0.8rem 0.95rem; border: 1px solid var(--cvm-line); border-radius: 12px; background: var(--cvm-card); }
.cvm-req.is-edited { border-color: rgba(167, 139, 250, 0.5); }
.cvm-req.is-removed { opacity: 0.7; align-items: center; }
.cvm-req.is-unscored { border-style: dashed; }
.cvm-req-main { display: grid; gap: 0.4rem; min-width: 0; }
.cvm-req-text { font-weight: 600; overflow-wrap: anywhere; }
.cvm-quote { font-size: 0.85rem; color: var(--cvm-muted); display: flex; gap: 0.45rem; align-items: baseline; }
.cvm-quote .fas { font-size: 0.7rem; opacity: 0.7; }
.cvm-req-tools { display: flex; flex-direction: column; gap: 0.35rem; flex: 0 0 auto; }
.cvm-mini { display: inline-flex; gap: 0.35rem; align-items: center; justify-content: center; padding: 0.35rem 0.65rem; border-radius: 999px; border: 1px solid var(--cvm-line-strong); background: transparent; color: var(--cvm-ink); font: inherit; font-size: 0.8rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
.cvm-mini:hover { background: var(--cvm-card-2); }
.cvm-mini-danger:hover { border-color: var(--cvm-missing); color: var(--cvm-missing); }

/* ---- the 10-second scoreboard ---- */
.cvm-scoreboard { display: grid; gap: 0.9rem; padding: 1.15rem 1.25rem; border: 1px solid var(--cvm-line-strong); border-radius: 18px; background: linear-gradient(160deg, rgba(79, 70, 229, 0.16), rgba(255, 255, 255, 0.03)); }
.cvm-score-main { display: grid; gap: 0.35rem; justify-items: start; }
.cvm-score-line { font-size: 1.35rem; font-weight: 700; letter-spacing: -0.015em; line-height: 1.25; }
.cvm-fit { display: inline-block; margin-top: 0.3rem; padding: 0.15rem 0.7rem; border-radius: 999px; font-size: 0.82rem; font-weight: 650; background: var(--cvm-card-2); }
.cvm-fit.is-strong { color: var(--cvm-ok); } .cvm-fit.is-moderate { color: var(--cvm-partial); } .cvm-fit.is-weak, .cvm-fit.is-poor { color: var(--cvm-missing); }
.cvm-statusbar { display: flex; height: 0.7rem; border-radius: 999px; overflow: hidden; gap: 2px; background: var(--cvm-card-2); }
.cvm-statusbar.is-compact { height: 0.5rem; }
.cvm-seg-fill { min-width: 6px; }
.cvm-seg-fill.is-covered { background: var(--cvm-ok); }
.cvm-seg-fill.is-partial { background: repeating-linear-gradient(135deg, var(--cvm-partial) 0 5px, color-mix(in srgb, var(--cvm-partial) 55%, transparent) 5px 8px); }
.cvm-seg-fill.is-listed { background: repeating-linear-gradient(90deg, var(--cvm-listed) 0 3px, color-mix(in srgb, var(--cvm-listed) 40%, transparent) 3px 6px); }
.cvm-seg-fill.is-missing { background: var(--cvm-missing); opacity: 0.85; }
.cvm-legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem 0.6rem; }
.cvm-legend-btn { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.7rem; border-radius: 999px; border: 1px solid var(--cvm-line); background: transparent; color: var(--cvm-ink); font: inherit; font-size: 0.85rem; cursor: pointer; }
.cvm-legend-btn:hover { background: var(--cvm-card-2); }
.cvm-legend-btn.is-on { border-color: var(--cvm-focus); background: rgba(167, 139, 250, 0.14); }
.cvm-legend-dot { width: 0.7rem; height: 0.7rem; border-radius: 3px; }
.cvm-legend-btn.is-covered .cvm-legend-dot { background: var(--cvm-ok); }
.cvm-legend-btn.is-partial .cvm-legend-dot { background: var(--cvm-partial); }
.cvm-legend-btn.is-listed .cvm-legend-dot { background: var(--cvm-listed); }
.cvm-legend-btn.is-missing .cvm-legend-dot { background: var(--cvm-missing); }
.cvm-score-foot { font-size: 0.86rem; color: var(--cvm-muted); }
.cvm-toolbar { display: flex; flex-wrap: wrap; gap: 0.7rem; justify-content: space-between; align-items: center; }
.cvm-pills { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.cvm-pillbtn { display: inline-flex; gap: 0.4rem; align-items: center; padding: 0.4rem 0.8rem; border-radius: 999px; border: 1px solid var(--cvm-line-strong); background: transparent; color: var(--cvm-ink); font: inherit; font-size: 0.86rem; font-weight: 600; cursor: pointer; }
.cvm-pillbtn.is-on { background: rgba(79, 70, 229, 0.35); border-color: rgba(167, 139, 250, 0.6); color: #fff; }
.cvm-sort { display: inline-flex; gap: 0.4rem; align-items: center; font-size: 0.86rem; color: var(--cvm-muted); }

/* ---- match cards ---- */
.cvm-matrix { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.8rem; }
.cvm-match { display: grid; gap: 0.7rem; padding: 1rem 1.1rem; border: 1px solid var(--cvm-line); border-left-width: 4px; border-radius: var(--cvm-r); background: var(--cvm-card); }
.cvm-match.is-covered { border-left-color: var(--cvm-ok); }
.cvm-match.is-partial { border-left-color: var(--cvm-partial); }
.cvm-match.is-listed { border-left-color: var(--cvm-listed); border-left-style: dashed; }
.cvm-match.is-missing { border-left-color: var(--cvm-missing); }
.cvm-match-head { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.cvm-pill { display: inline-flex; gap: 0.4rem; align-items: center; padding: 0.22rem 0.7rem; border-radius: 999px; font-size: 0.82rem; font-weight: 700; }
.cvm-pill.is-covered { background: color-mix(in srgb, var(--cvm-ok) 16%, transparent); color: var(--cvm-ok); }
.cvm-pill.is-partial { background: color-mix(in srgb, var(--cvm-partial) 16%, transparent); color: var(--cvm-partial); }
.cvm-pill.is-listed { background: color-mix(in srgb, var(--cvm-listed) 14%, transparent); color: var(--cvm-listed); }
.cvm-pill.is-missing { background: color-mix(in srgb, var(--cvm-missing) 16%, transparent); color: var(--cvm-missing); }
.cvm-kind { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cvm-muted); }
.cvm-kind.is-must { color: #ddd6fe; }
.cvm-match-title { overflow-wrap: anywhere; }
.cvm-match-cols { display: grid; grid-template-columns: 1fr; gap: 0.8rem; }
.cvm-col { display: grid; gap: 0.35rem; align-content: start; min-width: 0; }
.cvm-col-label { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cvm-muted); }
.cvm-quote-plain { font-size: 0.9rem; color: var(--cvm-muted); overflow-wrap: anywhere; }
.cvm-years { font-size: 0.85rem; color: var(--cvm-muted); display: flex; gap: 0.4rem; align-items: baseline; }
.cvm-years.is-short { color: var(--cvm-partial); }
.cvm-proofs { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.cvm-proof { display: grid; gap: 0.25rem; }
.cvm-proof-where { font-size: 0.78rem; color: var(--cvm-muted); }
.cvm-proof-line { margin: 0; padding: 0.55rem 0.8rem; border-left: 3px solid var(--cvm-line-strong); background: rgba(255, 255, 255, 0.03); border-radius: 0 10px 10px 0; font-size: 0.94rem; overflow-wrap: anywhere; }
.cvm-mark { background: rgba(251, 191, 36, 0.28); color: inherit; padding: 0.04em 0.18em; border-radius: 4px; box-shadow: inset 0 -2px 0 rgba(251, 191, 36, 0.8); }
.cvm-noproof { color: var(--cvm-muted); font-style: italic; }
.cvm-notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; font-size: 0.86rem; color: var(--cvm-muted); }
.cvm-notes .fas { margin-right: 0.2rem; }
.cvm-action { display: grid; gap: 0.35rem; padding: 0.75rem 0.9rem; border-radius: 12px; background: rgba(255, 255, 255, 0.035); border: 1px solid var(--cvm-line); }
.cvm-action-label { display: flex; gap: 0.45rem; align-items: baseline; }
.cvm-action-text { font-size: 0.93rem; }
.cvm-gaps { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.cvm-gap { display: grid; gap: 0.4rem; padding: 0.8rem 0.95rem; border: 1px solid var(--cvm-line); border-radius: 12px; background: var(--cvm-card); }
.cvm-q { display: grid; gap: 0.4rem; padding: 0.9rem 1rem; border: 1px solid var(--cvm-line); border-radius: 12px; background: rgba(255, 255, 255, 0.025); }
.cvm-q-text { display: flex; gap: 0.6rem; font-weight: 650; align-items: flex-start; }
.cvm-q-n { flex: 0 0 auto; display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: rgba(79, 70, 229, 0.4); font-size: 0.8rem; }
.cvm-addbox { display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; align-items: center; padding-top: 0.4rem; border-top: 1px dashed var(--cvm-line); }

/* ---- tailoring review ---- */
.cvm-promises { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.cvm-promises .fas { color: var(--cvm-ok); margin-right: 0.3rem; }
.cvm-block h4 { padding-bottom: 0.2rem; }
.cvm-block.is-locked { border-style: dashed; }
.cvm-bullet { display: grid; gap: 0.5rem; padding: 0.85rem 0.95rem; border: 1px solid var(--cvm-line); border-radius: 12px; background: rgba(255, 255, 255, 0.025); }
.cvm-bullet.is-change { border-left: 4px solid var(--cvm-ok); }
.cvm-bullet.is-reverted { border-left: 4px dashed var(--cvm-partial); }
.cvm-bullet-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: center; }
.cvm-state { margin-left: auto; font-size: 0.8rem; color: var(--cvm-muted); }
.cvm-state.is-accepted, .cvm-state.is-edited { color: var(--cvm-ok); font-weight: 650; }
.cvm-after { font-size: 1rem; overflow-wrap: anywhere; }
.cvm-after.cvm-same { color: var(--cvm-muted); }
.cvm-ins { text-decoration: none; background: color-mix(in srgb, var(--cvm-ok) 20%, transparent); border-radius: 3px; padding: 0 0.12em; }
.cvm-why { display: flex; gap: 0.4rem; align-items: baseline; font-size: 0.9rem; color: var(--cvm-partial); }
.cvm-unsupported { border-style: dashed; border-color: color-mix(in srgb, var(--cvm-partial) 50%, transparent); }
.cvm-draft-text { padding: 0.5rem 0.7rem; border-radius: 8px; background: rgba(251, 191, 36, 0.07); font-size: 0.9rem; color: var(--cvm-muted); text-decoration: line-through; text-decoration-color: rgba(251, 191, 36, 0.5); }
.cvm-bullet-tools { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.cvm-toggle { display: inline-flex; gap: 0.4rem; align-items: center; padding: 0.38rem 0.8rem; border-radius: 999px; border: 1px solid var(--cvm-line-strong); background: transparent; color: var(--cvm-ink); font: inherit; font-size: 0.86rem; font-weight: 600; cursor: pointer; }
.cvm-toggle:hover { background: var(--cvm-card-2); }
.cvm-toggle.is-on { background: rgba(79, 70, 229, 0.38); border-color: rgba(167, 139, 250, 0.7); color: #fff; }
.cvm-editbox { display: grid; gap: 0.5rem; }
.cvm-skilltoggles { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.6rem 1rem; }
.cvm-skilltoggles li { display: inline-flex; gap: 0.5rem; align-items: center; }
.cvm-omitted { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.4rem; }
.cvm-applybar { position: sticky; bottom: 0.5rem; z-index: 2; display: grid; gap: 0.6rem; padding: 0.9rem 1rem; margin-top: 0.4rem; border: 1px solid var(--cvm-line-strong); border-radius: var(--cvm-r); background: var(--studio-surface-strong, #14122a); box-shadow: 0 -12px 28px rgba(0, 0, 0, 0.35); }
.cvm-applybar-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.cvm-apply-name { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; flex: 1 1 280px; }
.cvm-apply-name input { flex: 1 1 180px; width: auto; min-width: 0; }
.cvm-applybar-count { font-weight: 650; }
.cvm-ba { padding: 0.7rem 0.9rem; border-radius: 10px; border: 1px solid var(--cvm-line); }
.cvm-ba.is-after { border-color: var(--cvm-ok); }
.cvm-ba-label { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--cvm-muted); }
.cvm-letter { display: grid; gap: 0.7rem; }
.cvm-letter-p { display: grid; gap: 0.3rem; padding: 0.8rem 1rem; border-radius: 12px; background: rgba(255, 255, 255, 0.03); border: 1px solid var(--cvm-line); }

/* ---- coverage + checks ---- */
.cvm-coverage { gap: 0.9rem; }
.cvm-cov-top { display: flex; gap: 2rem; flex-wrap: wrap; align-items: flex-end; }
.cvm-bignum { font-size: 3.4rem; line-height: 1; font-weight: 800; letter-spacing: -0.03em; color: var(--cvm-ink); }
.cvm-bignum-sm { font-size: 2.1rem; }
.cvm-bignum.is-empty { color: var(--cvm-muted); }
.cvm-cov-claim { font-size: 1.02rem; font-weight: 550; max-width: 62ch; }
.cvm-cov-not { display: flex; gap: 0.5rem; align-items: baseline; padding: 0.7rem 0.9rem; border-radius: 12px; background: color-mix(in srgb, var(--cvm-partial) 10%, transparent); border: 1px solid color-mix(in srgb, var(--cvm-partial) 40%, transparent); font-size: 0.93rem; }
.cvm-breakdown { display: grid; grid-template-columns: max-content 1fr; gap: 0.3rem 1rem; margin: 0; }
.cvm-breakdown dt { font-weight: 650; }
.cvm-breakdown dd { margin: 0; color: var(--cvm-muted); }
.cvm-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }
.cvm-check-item { display: flex; gap: 0.8rem; padding: 0.8rem 0.95rem; border: 1px solid var(--cvm-line); border-radius: 12px; background: var(--cvm-card); }
.cvm-check-ic { flex: 0 0 auto; width: 1.4rem; text-align: center; padding-top: 0.15rem; }
.cvm-check-item.is-pass .cvm-check-ic { color: var(--cvm-ok); }
.cvm-check-item.is-warn .cvm-check-ic { color: var(--cvm-partial); }
.cvm-check-item.is-fail .cvm-check-ic { color: var(--cvm-missing); }
.cvm-check-item.is-info .cvm-check-ic { color: var(--cvm-listed); }
.cvm-check-body { display: grid; gap: 0.25rem; min-width: 0; }
.cvm-check-title { font-weight: 650; display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.cvm-check-tag { font-size: 0.72rem; padding: 0.05rem 0.5rem; border-radius: 999px; border: 1px solid currentColor; font-weight: 700; }
.cvm-check-tag.is-warn { color: var(--cvm-partial); } .cvm-check-tag.is-fail { color: var(--cvm-missing); } .cvm-check-tag.is-info { color: var(--cvm-listed); }

/* ---- undo bar ---- */
.cvm-undo { display: flex; gap: 1rem; align-items: center; justify-content: space-between; padding: 0.7rem 1rem; border-radius: 12px; background: var(--studio-surface-strong, #14122a); border: 1px solid rgba(167, 139, 250, 0.5); color: var(--studio-ink, #e5e7eb); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4); pointer-events: auto; }
.cvm-undo-btn { background: transparent; border: 0; color: #c4b5fd; font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; padding: 0.2rem 0.4rem; }
.cvm-flash { outline: 3px solid var(--cvm-focus, #c4b5fd) !important; outline-offset: 2px; transition: outline-color 0.3s; }

/* ---- the old keyword "ATS score" panel is replaced by the match experience ---- */
html[data-cv-match] .ats-panel[data-cv="ats-panel"] { display: none; }

/* ---- wider screens: requirement and proof side by side ---- */
@media (min-width: 760px) {
    .cvm-match-cols { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
    .cvm-score-main { grid-template-columns: 1fr; }
}

/* ---- phones ---- */
@media (max-width: 640px) {
    .cvm-ws { padding: 1rem 0.9rem 1.2rem; border-radius: 16px; }
        .cvm-tab { padding: 0.45rem 0.6rem; font-size: 0.86rem; }
    .cvm-tab-n, .cvm-tab .fas { display: none; }
    .cvm-req { flex-direction: column; }
    .cvm-req-tools { flex-direction: row; flex-wrap: wrap; }
    .cvm-score-line { font-size: 1.15rem; }
    .cvm-bignum { font-size: 2.8rem; }
    .cvm-state { margin-left: 0; width: 100%; }
    .cvm-breakdown { grid-template-columns: 1fr; }
    .cvm-steps { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .cvm-spin { animation-duration: 3s; }
    .cvm-ws * { scroll-behavior: auto !important; transition: none !important; }
}

/* ---- touch targets: every control in the workspace is at least 44px tall (WCAG 2.5.5 / D's touch-target rule) ---- */
.cvm-ws button,
.cvm-ws select,
.cvm-ws input[type="text"],
.cvm-ws .studio-btn,
.cvm-ws .btn { min-height: 44px; }
.cvm-tab, .cvm-seg-btn, .cvm-pillbtn, .cvm-legend-btn, .cvm-mini, .cvm-toggle { min-height: 44px; }
.cvm-linkbtn, .cvm-linklike { min-height: 44px; display: inline-flex; align-items: center; }
.cvm-ws .cvm-check, .cvm-ws .cvm-consent { min-height: 44px; align-items: center; }
.cvm-ws input[type="checkbox"] { min-width: 1.15rem; min-height: 1.15rem; }
.cvm-ws .cvm-check input, .cvm-ws .cvm-consent input { margin-top: 0; }
.cvm-ws summary { min-height: 44px; display: flex; align-items: center; }
.cvm-small { min-height: 44px !important; }

/* ---- long unbroken words (URLs, pasted junk) never push the page wider ---- */
.cvm-ws { overflow-wrap: anywhere; word-break: normal; }
.cvm-ws *, .cvm-ws p, .cvm-ws li, .cvm-ws h2, .cvm-ws h3, .cvm-ws h4, .cvm-ws blockquote, .cvm-ws q { min-width: 0; overflow-wrap: anywhere; }
.cvm-match > *, .cvm-req, .cvm-req-main, .cvm-col, .cvm-proof, .cvm-gap, .cvm-q, .cvm-bullet, .cvm-notice, .cvm-reco { min-width: 0; max-width: 100%; }
.cvm-ws .cvm-match-title { font-size: 1rem; font-weight: 650; }
.cvm-ws .cvm-quote, .cvm-ws .cvm-quote-plain { word-break: break-word; }
.cvm-chip { max-width: 100%; white-space: normal; text-align: left; }
.cvm-proof-answer { border-left-style: dashed; border-left-color: var(--cvm-listed); }
.cvm-pill.is-answered { background: color-mix(in srgb, #c4b5fd 16%, transparent); color: #ddd6fe; }
.cvm-match.is-answered { border-left-color: #c4b5fd; border-left-style: dotted; }
.cvm-seg-fill.is-answered { background: repeating-linear-gradient(45deg, #c4b5fd 0 3px, color-mix(in srgb, #c4b5fd 35%, transparent) 3px 6px); }
.cvm-legend-btn.is-answered .cvm-legend-dot { background: #c4b5fd; }
.cvm-potential { display: flex; gap: 0.45rem; align-items: baseline; font-size: 0.9rem; color: #ddd6fe; }
.cvm-reco { display: grid; gap: 0.4rem; padding: 0.9rem 1rem; border-radius: 12px; border: 1px solid var(--cvm-line-strong); background: var(--cvm-card-2); }
.cvm-reco.is-probably_skip { border-color: color-mix(in srgb, var(--cvm-partial) 50%, transparent); }
.cvm-reco-head { font-weight: 650; }

/* phones: the six steps are a tidy 3 x 2 grid, never an orphan on a third row */
@media (max-width: 640px) {
    .cvm-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.3rem; }
    .cvm-tab { justify-content: center; text-align: center; padding: 0.4rem 0.3rem; }
    .cvm-tab-badge { display: none; }
}

/* step labels are never broken mid-word (the global long-token rule must not reach them) */
.cvm-ws .cvm-tab, .cvm-ws .cvm-tab * { overflow-wrap: normal; word-break: keep-all; white-space: nowrap; }
@media (max-width: 640px) { .cvm-tab { font-size: 0.78rem; padding: 0.4rem 0.15rem; } .cvm-tabs { gap: 0.2rem; } }

.cvm-about { display: block; font-size: 0.8rem; line-height: 1.1; }
select[data-cv="m-region"] { min-width: 44px; }