/* WorkScout 360 — job seeker dashboard. Everything is scoped under .ws360-app. */

/* ---------- Scoped reset (protects against theme styles) ---------- */
.ws360-app,
.ws360-app *,
.ws360-app *::before,
.ws360-app *::after { box-sizing: border-box; }
.ws360-app { font-family: var(--ws360-font); font-size: 16px; line-height: 1.5; color: var(--ws360-ink); -webkit-font-smoothing: antialiased; text-align: left; }
.ws360-app.ws360-app h1, .ws360-app.ws360-app h2, .ws360-app.ws360-app h3, .ws360-app.ws360-app p { margin: 0; padding: 0; }
/* Doubled class beats the theme's ".type-page ul li" / ".post-content ul li" list styling. */
.ws360-app.ws360-app ul,
.ws360-app.ws360-app ul > li { list-style: none; margin: 0; padding: 0; background: none; }
.ws360-app.ws360-app ul > li::before { content: none; display: none; }
.ws360-app .ws360-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ws360-app h1, .ws360-app h2, .ws360-app h3 { font-family: var(--ws360-font-display); color: var(--ws360-ink); letter-spacing: -0.01em; text-transform: none; }
.ws360-app a { color: var(--ws360-teal); text-decoration: none; }
.ws360-app a:hover { color: var(--ws360-teal-dark); }
.ws360-app a:focus-visible,
.ws360-app button:focus-visible,
.ws360-app main:focus-visible { outline: none; box-shadow: var(--ws360-focus); border-radius: var(--ws360-r-control); }
.ws360-app svg.ws360-icon { flex: none; display: block; }
/* The theme sets its own font on p, a and span; keep the plugin's type scale. */
.ws360-app :where(p, span, a, li, strong, label, button, input, select, textarea, article) { font-family: inherit; text-transform: none; letter-spacing: normal; }

/* ---------- Shell ---------- */
.ws360-app { display: grid; grid-template-columns: 248px minmax(0, 1fr); background: var(--ws360-ground); border-radius: var(--ws360-r-card); overflow: hidden; border: 1px solid var(--ws360-line); margin: 0 0 var(--ws360-s-6); }
.ws360-app--guest { display: block; }
.ws360-app--embed { display: flex; flex-direction: column; gap: var(--ws360-s-5); padding: var(--ws360-s-5); }
.ws360-main { padding: var(--ws360-s-6) var(--ws360-s-6) var(--ws360-s-7); display: flex; flex-direction: column; gap: var(--ws360-s-5); min-width: 0; }

/* Sidebar */
.ws360-side { background: var(--ws360-ink); color: #e4e7ec; padding: var(--ws360-s-5) var(--ws360-s-4); display: flex; flex-direction: column; gap: var(--ws360-s-5); }
.ws360-brand { display: flex; align-items: center; gap: 10px; padding: 0 var(--ws360-s-2); }
.ws360-logo { width: 34px; height: 34px; border-radius: 9px; background: var(--ws360-ink-2); color: var(--ws360-teal-bright); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.ws360-app--guest .ws360-logo { background: var(--ws360-ink); }
.ws360-brand__name { font-family: var(--ws360-font-display); font-weight: 700; font-size: 17px; color: #ffffff; }
.ws360-brand__name--dark { color: var(--ws360-ink); }
.ws360-side__list { display: flex; flex-direction: column; gap: 2px; }
.ws360-app .ws360-side__link { display: flex; align-items: center; gap: 12px; min-height: var(--ws360-tap); padding: 0 12px; border-radius: var(--ws360-r-control); color: #c9d1dd; font-size: 15px; }
.ws360-app .ws360-side__link:hover { background: var(--ws360-ink-2); color: #ffffff; }
.ws360-app .ws360-side__link.is-active { background: var(--ws360-ink-2); color: #ffffff; font-weight: 600; }
.ws360-side__link.is-active .ws360-icon { color: var(--ws360-teal-bright); }
.ws360-side__link > span:first-of-type { flex: 1; }
.ws360-side__foot { margin-top: auto; display: flex; flex-direction: column; gap: var(--ws360-s-2); padding: var(--ws360-s-3); border-radius: 12px; background: var(--ws360-ink-2); }
.ws360-app .ws360-side__back { display: flex; gap: 8px; align-items: center; color: var(--ws360-teal-bright); font-size: 14px; font-weight: 600; min-height: 36px; }
.ws360-app .ws360-side__logout { color: #c9d1dd; font-size: 13px; }
.ws360-app .ws360-side__logout:hover { color: #ffffff; }

/* Bottom tab bar (phones only) */
.ws360-tabbar { display: none; }

/* ---------- Building blocks ---------- */
.ws360-card { background: var(--ws360-surface); border: 1px solid var(--ws360-line); border-radius: var(--ws360-r-card); box-shadow: var(--ws360-shadow); padding: var(--ws360-s-5); display: flex; flex-direction: column; gap: var(--ws360-s-3); min-width: 0; }
.ws360-app .ws360-display { font-size: clamp(28px, 4vw, 40px); line-height: 1.2; font-weight: 700; letter-spacing: -0.02em; }
.ws360-app .ws360-h1 { font-size: clamp(22px, 3vw, 28px); line-height: 1.3; font-weight: 700; }
.ws360-app .ws360-h2 { font-size: 20px; line-height: 28px; font-weight: 600; }
.ws360-app .ws360-job__title { font-size: 16px; line-height: 22px; font-weight: 600; }
.ws360-lead { font-size: 16px; line-height: 24px; color: var(--ws360-slate); max-width: 680px; }
.ws360-muted { font-size: 14px; color: var(--ws360-slate); }
.ws360-small { font-size: 13px; line-height: 19px; color: var(--ws360-slate); }
.ws360-stat { font-family: var(--ws360-font-display); font-size: 32px; line-height: 40px; font-weight: 700; color: var(--ws360-ink); }
.ws360-stat--amber { color: var(--ws360-amber); font-size: 26px; }
.ws360-stat--quiet { color: var(--ws360-quiet); }
.ws360-row { display: flex; align-items: center; gap: var(--ws360-s-3); }
.ws360-row--between { justify-content: space-between; }
.ws360-row--wrap { flex-wrap: wrap; }

.ws360-app .ws360-btn { display: inline-flex; align-items: center; justify-content: center; min-height: var(--ws360-tap); padding: 0 20px; border-radius: var(--ws360-r-control); font: 600 15px/1 var(--ws360-font); border: 1px solid transparent; cursor: pointer; text-decoration: none; }
.ws360-app .ws360-btn--primary { background: var(--ws360-teal); color: #ffffff; }
.ws360-app .ws360-btn--primary:hover { background: var(--ws360-teal-dark); color: #ffffff; }
.ws360-app .ws360-btn--secondary { background: var(--ws360-surface); color: var(--ws360-ink); border-color: var(--ws360-line-2); }
.ws360-app .ws360-btn--secondary:hover { border-color: var(--ws360-slate); color: var(--ws360-ink); }

.ws360-soon { align-self: flex-start; display: inline-block; font-size: 12px; font-weight: 600; line-height: 16px; padding: 2px 8px; border-radius: var(--ws360-r-pill); background: var(--ws360-line-soft); color: #344054; white-space: nowrap; }
.ws360-tag { align-self: flex-start; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: var(--ws360-r-pill); background: var(--ws360-teal-50); color: var(--ws360-teal-dark); }
.ws360-icon-tile { width: 40px; height: 40px; flex: none; border-radius: var(--ws360-r-control); background: var(--ws360-line-soft); color: var(--ws360-slate); display: inline-flex; align-items: center; justify-content: center; }
.ws360-icon-tile--teal { background: var(--ws360-teal-50); color: var(--ws360-teal); }
.ws360-icon-tile--amber { background: var(--ws360-amber-50); color: var(--ws360-amber); }
.ws360-icon-tile--lg { width: 56px; height: 56px; border-radius: 14px; }

.ws360-grid { display: grid; gap: var(--ws360-s-4); }
.ws360-grid--stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws360-s-4); }
.ws360-grid--actions { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ws360-grid--jobs { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--ws360-s-3); }

/* Welcome */
.ws360-welcome { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ws360-s-5); padding: var(--ws360-s-6) var(--ws360-s-5); }
.ws360-welcome__text { display: flex; flex-direction: column; gap: var(--ws360-s-2); flex: 1 1 380px; }

/* Quick actions */
.ws360-app .ws360-action { display: flex; gap: 14px; align-items: flex-start; background: var(--ws360-surface); border: 1px solid var(--ws360-line); border-radius: var(--ws360-r-card); padding: 18px; color: var(--ws360-ink); min-height: 96px; }
.ws360-app a.ws360-action:hover { border-color: var(--ws360-teal); color: var(--ws360-ink); }
.ws360-action__text { display: flex; flex-direction: column; gap: 4px; }
.ws360-action__text strong { font-size: 15px; }
.ws360-action.is-soon .ws360-soon { margin-top: 4px; }

/* Two-column area */
.ws360-split { display: flex; flex-wrap: wrap; gap: var(--ws360-s-5); align-items: flex-start; }
.ws360-split__main { flex: 999 1 420px; }
.ws360-split__side { flex: 1 1 260px; }

/* Pipeline */
.ws360-pipeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--ws360-s-3); }
.ws360-pipeline__col { background: var(--ws360-ground); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.ws360-pipeline__col strong { font-family: var(--ws360-font-display); font-size: 24px; }
.ws360-status { align-self: flex-start; font-size: 13px; font-weight: 600; padding: 3px 10px; border-radius: var(--ws360-r-pill); background: var(--ws360-line-soft); color: #344054; }
.ws360-status--preparing { background: var(--ws360-blue-50); color: var(--ws360-blue-dark); }
.ws360-status--applied { background: var(--ws360-teal-50); color: var(--ws360-teal-dark); }
.ws360-status--interview { background: var(--ws360-purple-50); color: var(--ws360-purple-dark); }
.ws360-status--offer { background: var(--ws360-green-50); color: var(--ws360-green-dark); }

/* Deadlines */
.ws360-deadlines { display: flex; flex-direction: column; gap: var(--ws360-s-3); }
.ws360-deadline { display: flex; gap: 12px; align-items: center; }
.ws360-date { width: 48px; flex: none; text-align: center; border-radius: var(--ws360-r-control); background: var(--ws360-ground); color: #344054; padding: 6px 0; display: flex; flex-direction: column; line-height: 1.2; }
.ws360-date.is-soon { background: var(--ws360-amber-50); color: var(--ws360-amber-dark); }
.ws360-date strong { font-size: 16px; }
.ws360-date span { font-size: 11px; font-weight: 600; text-transform: uppercase; }
.ws360-deadline__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ws360-deadline__text strong { font-size: 14px; }

/* Jobs */
.ws360-job { border: 1px solid var(--ws360-line); border-radius: 12px; padding: var(--ws360-s-4); display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ws360-app .ws360-job__title a { color: var(--ws360-ink); }
.ws360-app .ws360-job__title a:hover { color: var(--ws360-teal); }
.ws360-job__deadline { color: var(--ws360-amber-dark); font-weight: 600; }

/* Empty and coming soon */
.ws360-empty { border: 1px dashed var(--ws360-line-2); border-radius: 12px; padding: var(--ws360-s-5); display: flex; flex-direction: column; align-items: center; gap: var(--ws360-s-2); text-align: center; }
.ws360-empty--compact { padding: var(--ws360-s-4); }
.ws360-empty strong { font-size: 15px; }
.ws360-soon-page { align-items: flex-start; padding: var(--ws360-s-6); gap: var(--ws360-s-4); }

/* Guest */
.ws360-hero { padding: var(--ws360-s-6); gap: var(--ws360-s-4); }
.ws360-hero .ws360-brand { padding: 0; }
.ws360-trust { display: flex; gap: 10px; align-items: center; font-size: 14px; color: var(--ws360-slate); }
.ws360-trust .ws360-icon { color: var(--ws360-teal); }

/* ---------- Overview extras ---------- */
.ws360-app .ws360-job__check { font-size: 13px; font-weight: 600; margin-top: 4px; }
.ws360-recent { display: flex; flex-direction: column; }
.ws360-app.ws360-app .ws360-recent > li { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--ws360-line-soft); }
.ws360-app.ws360-app .ws360-recent > li:last-child { border-bottom: 0; }
.ws360-app .ws360-recent a { color: var(--ws360-ink); font-size: 14px; font-weight: 500; }

/* ---------- CV tool: form ---------- */
.ws360-cvform { display: flex; flex-direction: column; gap: var(--ws360-s-4); }
.ws360-step { gap: var(--ws360-s-4); }
.ws360-step__head { display: flex; align-items: center; gap: 12px; }
.ws360-step__num { width: 28px; height: 28px; flex: none; border-radius: var(--ws360-r-pill); background: var(--ws360-ink); color: #ffffff; font: 700 14px/28px var(--ws360-font); text-align: center; }
.ws360-upload { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ws360-s-3); }
.ws360-app .ws360-upload__btn { gap: 8px; }
.ws360-fieldset { display: flex; flex-direction: column; gap: 6px; }
.ws360-fieldset[hidden] { display: none; }
.ws360-fieldset--inline { max-width: 320px; }
.ws360-app .ws360-fieldset label { font-size: 14px; font-weight: 600; color: var(--ws360-ink); }
.ws360-app.ws360-app textarea,
.ws360-app.ws360-app select { width: 100%; max-width: 100%; box-sizing: border-box; border: 1px solid var(--ws360-line-2); border-radius: var(--ws360-r-control); background-color: #ffffff; color: var(--ws360-ink); font: 400 16px/1.5 var(--ws360-font); padding: 12px 14px; margin: 0; box-shadow: none; }
.ws360-app.ws360-app select { min-height: var(--ws360-tap); padding-top: 0; padding-bottom: 0; }
.ws360-app.ws360-app textarea:focus,
.ws360-app.ws360-app select:focus { outline: none; border-color: var(--ws360-teal); box-shadow: 0 0 0 1px var(--ws360-teal); }
.ws360-consent { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; line-height: 21px; color: var(--ws360-slate); cursor: pointer; }
.ws360-app.ws360-app .ws360-consent input { width: 20px; height: 20px; margin: 1px 0 0; flex: none; accent-color: var(--ws360-teal); }
.ws360-app [data-ws360-formerror] { color: var(--ws360-red); font-weight: 600; }
.ws360-app .ws360-btn[disabled] { opacity: 0.55; cursor: not-allowed; }
.ws360-notice { flex-direction: row; align-items: center; }
.ws360-notice--warn { background: var(--ws360-amber-50); border-color: #fedf89; color: var(--ws360-amber-dark); }

.ws360-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ws360-s-3); border: 0; padding: 0; margin: 0; min-width: 0; }
.ws360-mode { position: relative; cursor: pointer; }
.ws360-app.ws360-app .ws360-mode input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ws360-mode__box { display: flex; flex-direction: column; gap: 4px; padding: 16px; border-radius: var(--ws360-r-card); border: 1px solid var(--ws360-line); background: var(--ws360-surface); min-height: 76px; }
.ws360-mode__box strong { font-size: 15px; }
.ws360-mode input:checked + .ws360-mode__box { border: 2px solid var(--ws360-teal); background: var(--ws360-teal-50); padding: 15px; }
.ws360-mode input:focus-visible + .ws360-mode__box { box-shadow: var(--ws360-focus); }

/* ---------- CV tool: progress ---------- */
.ws360-progress[hidden], .ws360-results[hidden] { display: none; }
.ws360-steps { display: flex; flex-direction: column; gap: 10px; }
.ws360-app.ws360-app .ws360-steps > li { display: flex; align-items: center; gap: 12px; font-size: 15px; color: var(--ws360-quiet); }
.ws360-app.ws360-app .ws360-steps > li::before { content: ""; display: block; width: 20px; height: 20px; flex: none; box-sizing: border-box; border-radius: 999px; border: 2px solid var(--ws360-line-2); }
.ws360-app.ws360-app .ws360-steps > li.is-active { color: var(--ws360-ink); font-weight: 600; }
.ws360-app.ws360-app .ws360-steps > li.is-active::before { border: 3px solid var(--ws360-teal-50); border-top-color: var(--ws360-teal); animation: ws360-spin 0.9s linear infinite; }
.ws360-app.ws360-app .ws360-steps > li.is-done { color: var(--ws360-ink); }
.ws360-app.ws360-app .ws360-steps > li.is-done::before { border: 0; background: var(--ws360-teal); box-shadow: inset 0 0 0 6px var(--ws360-teal), inset 0 0 0 10px #ffffff; }
.ws360-bar { height: 8px; border-radius: 999px; background: var(--ws360-line-soft); overflow: hidden; }
.ws360-bar span { display: block; height: 8px; width: 10%; border-radius: 999px; background: var(--ws360-teal); transition: width 0.6s ease; }
@keyframes ws360-spin { to { transform: rotate(360deg); } }

/* ---------- CV tool: report ---------- */
.ws360-results { display: flex; flex-direction: column; gap: var(--ws360-s-4); outline: none; }
.ws360-report-head { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ws360-s-5); }
.ws360-report-head__job { display: flex; flex-direction: column; gap: 4px; flex: 2 1 280px; }
.ws360-report-head__notes { flex-basis: 100%; }
.ws360-band { flex: 1 1 260px; display: flex; flex-direction: column; gap: 8px; padding: 16px 18px; border-radius: 14px; background: var(--ws360-ground); }
.ws360-band__label { font-family: var(--ws360-font-display); font-size: 22px; }
.ws360-band--strong, .ws360-band--good { background: var(--ws360-teal-50); color: var(--ws360-teal-dark); }
.ws360-band--partial { background: var(--ws360-amber-50); color: var(--ws360-amber-dark); }
.ws360-band--low { background: var(--ws360-red-50); color: var(--ws360-red-dark); }
.ws360-band .ws360-small { color: inherit; }
.ws360-band__meter { display: flex; gap: 4px; }
.ws360-band__meter span { flex: 1; height: 8px; border-radius: 4px; background: #ffffff; }
.ws360-band__meter span.is-on { background: currentColor; }
.ws360-reqs { display: flex; flex-direction: column; }
.ws360-app.ws360-app .ws360-reqs > li { padding: 12px 0; border-bottom: 1px solid var(--ws360-line-soft); display: flex; flex-direction: column; gap: 6px; }
.ws360-app.ws360-app .ws360-reqs > li:last-child { border-bottom: 0; }
.ws360-req__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.ws360-req__top strong { font-size: 15px; flex: 1 1 220px; }
.ws360-chip { display: inline-block; font-size: 12px; font-weight: 600; line-height: 16px; padding: 3px 9px; border-radius: var(--ws360-r-pill); background: var(--ws360-line-soft); color: #344054; white-space: nowrap; }
.ws360-chip--met { background: var(--ws360-green-50); color: var(--ws360-green-dark); }
.ws360-chip--partial { background: var(--ws360-amber-50); color: var(--ws360-amber-dark); }
.ws360-chip--missing { background: var(--ws360-red-50); color: var(--ws360-red-dark); }
.ws360-chip--quiet { background: #ffffff; border: 1px solid var(--ws360-line); color: var(--ws360-slate); }
.ws360-quote { display: block; font-size: 14px; line-height: 21px; color: var(--ws360-slate); border-left: 0; padding: 8px 12px; background: var(--ws360-ground); border-radius: 8px; quotes: "\201C" "\201D"; }
.ws360-report-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: var(--ws360-s-4); align-items: start; }
.ws360-point { display: flex; flex-direction: column; gap: 6px; padding: 10px 0; border-bottom: 1px solid var(--ws360-line-soft); }
.ws360-point:last-child { border-bottom: 0; }
.ws360-point strong { font-size: 15px; }
.ws360-point .ws360-chip { align-self: flex-start; }
.ws360-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ws360-chips__label { font-size: 13px; font-weight: 600; color: var(--ws360-slate); min-width: 90px; }
.ws360-suggestions { display: flex; flex-direction: column; gap: 10px; }
.ws360-app.ws360-app .ws360-suggestions > li { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; font-size: 15px; line-height: 22px; }
.ws360-app.ws360-app textarea.ws360-summary { font-size: 16px; line-height: 26px; }
.ws360-app .ws360-results .ws360-btn { align-self: flex-start; }
.ws360-warn { color: var(--ws360-amber-dark); font-weight: 600; }
.ws360-app .ws360-btn--small { min-height: 36px; padding: 0 14px; font-size: 14px; }
.ws360-priorities { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; font-size: 15px; line-height: 22px; }
.ws360-checks { display: flex; flex-direction: column; }
.ws360-app.ws360-app .ws360-checks > li { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--ws360-line-soft); }
.ws360-app.ws360-app .ws360-checks > li:last-child { border-bottom: 0; }
.ws360-check .ws360-chip { min-width: 44px; text-align: center; }
.ws360-check__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ws360-check__text strong { font-size: 15px; }
.ws360-rewrite { display: flex; flex-direction: column; gap: 8px; padding: 14px 0; border-bottom: 1px solid var(--ws360-line-soft); }
.ws360-rewrite:last-of-type { border-bottom: 0; }
.ws360-rewrite__before, .ws360-rewrite__after { display: flex; gap: 10px; align-items: baseline; padding: 10px 12px; border-radius: 10px; font-size: 15px; line-height: 22px; }
.ws360-rewrite__before { background: var(--ws360-ground); color: var(--ws360-slate); }
.ws360-rewrite__after { background: var(--ws360-teal-50); color: var(--ws360-ink); }
.ws360-rewrite__label { flex: none; width: 52px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
.ws360-rewrite .ws360-btn { align-self: flex-start; }

/* ---------- Cover letters ---------- */
.ws360-details-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--ws360-s-3); }
.ws360-app.ws360-app textarea.ws360-letter__text { font: 400 15px/1.65 Georgia, "Times New Roman", serif; min-height: 320px; }
.ws360-letter .ws360-row { margin-top: 4px; }
.ws360-app .ws360-letter .ws360-link { align-self: flex-start; font-weight: 600; }

/* ---------- Interview prep ---------- */
.ws360-prep-tools { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--ws360-s-3); }
.ws360-switch { display: flex; gap: 10px; align-items: flex-start; flex: 1 1 280px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ws360-ink); cursor: pointer; }
.ws360-app.ws360-app .ws360-switch input { width: 20px; height: 20px; margin: 0; flex: none; accent-color: var(--ws360-teal); }
.ws360-questions { display: flex; flex-direction: column; gap: var(--ws360-s-3); counter-reset: ws360-q; }
.ws360-question { counter-increment: ws360-q; }
.ws360-question__top { display: flex; align-items: center; gap: 10px; }
.ws360-question__top::before { content: counter(ws360-q); width: 26px; height: 26px; border-radius: var(--ws360-r-pill); background: var(--ws360-ink); color: #ffffff; font: 700 13px/26px var(--ws360-font); text-align: center; }
.ws360-app.ws360-app .ws360-question__text { margin: 0; font: 600 17px/1.45 var(--ws360-font-display); color: var(--ws360-ink); }
.ws360-reveal { display: flex; flex-direction: column; gap: 10px; border-top: 1px solid var(--ws360-line-soft); padding-top: 10px; }
.ws360-reveal > summary { cursor: pointer; font-size: 14px; font-weight: 600; color: var(--ws360-teal); min-height: 32px; display: flex; align-items: center; }
.ws360-reveal[open] > summary { margin-bottom: 4px; }
.ws360-answer { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-radius: 12px; background: var(--ws360-teal-50); }
.ws360-app.ws360-app .ws360-answer p { margin: 0; font-size: 15px; line-height: 23px; color: var(--ws360-ink); }
.ws360-answer .ws360-rewrite__label { width: auto; color: var(--ws360-teal-dark); }
.ws360-answer .ws360-quote { background: #ffffff; }
.ws360-own { padding: 12px 14px; border-radius: 12px; background: var(--ws360-ground); }
.ws360-app.ws360-app .ws360-ticks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ws360-app.ws360-app .ws360-ticks > li { position: relative; padding-left: 28px; font-size: 15px; line-height: 22px; color: var(--ws360-ink); }
.ws360-app.ws360-app .ws360-ticks > li::before { content: ""; display: block; position: absolute; left: 2px; top: 5px; width: 14px; height: 8px; border-left: 2px solid var(--ws360-teal); border-bottom: 2px solid var(--ws360-teal); transform: rotate(-45deg); }

/* ---------- Scam Shield ---------- */
.ws360-scam-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--ws360-s-3); }
.ws360-app .ws360-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ws360-signlist .ws360-check .ws360-chip { min-width: 64px; }

/* ---------- Career Resources (guides) ---------- */
.ws360-section-block { display: flex; flex-direction: column; gap: var(--ws360-s-3); }
.ws360-guide-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--ws360-s-3); }
.ws360-app a.ws360-guide-card { color: var(--ws360-ink); gap: 6px; transition: border-color 0.15s ease; }
.ws360-app a.ws360-guide-card:hover { border-color: var(--ws360-teal); color: var(--ws360-ink); }
.ws360-guide-card strong { font-size: 16px; line-height: 22px; }
.ws360-guide-card__meta { margin-top: auto; color: var(--ws360-quiet); }
.ws360-country-form label { font-size: 14px; font-weight: 600; }
.ws360-app.ws360-app .ws360-country-form select { width: auto; min-width: 200px; }
.ws360-guide { gap: var(--ws360-s-4); }
.ws360-guide__body { font-size: 16px; line-height: 1.7; display: flex; flex-direction: column; gap: 12px; max-width: 70ch; }
.ws360-app.ws360-app .ws360-guide__body h2 { font-size: 20px; line-height: 28px; margin: 8px 0 0; }
.ws360-app.ws360-app .ws360-guide__body ul,
.ws360-app.ws360-app .ws360-guide__body ol { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; }
.ws360-app.ws360-app .ws360-guide__body ul > li { list-style: disc; }
.ws360-app.ws360-app .ws360-guide__body ol > li { list-style: decimal; }
.ws360-guide-meta { border-top: 1px solid var(--ws360-line-soft); padding-top: var(--ws360-s-3); display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: var(--ws360-slate); }
.ws360-app.ws360-app .ws360-guide-meta ul { padding-left: 18px; }
.ws360-app.ws360-app .ws360-guide-meta ul > li { list-style: disc; }
.ws360-partner-resources { overflow: hidden; }

/* ---------- Employers ---------- */
.ws360-company-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--ws360-s-3); }
.ws360-company { gap: 10px; }
.ws360-company--featured { border-color: #99d5cd; }
.ws360-company__top { display: flex; gap: 12px; align-items: center; min-width: 0; }
.ws360-company__logo { width: 48px; height: 48px; flex: none; border-radius: 10px; border: 1px solid var(--ws360-line); object-fit: contain; background: #ffffff; }
.ws360-company__logo--blank { display: inline-flex; align-items: center; justify-content: center; font: 700 18px var(--ws360-font-display); color: var(--ws360-teal); background: var(--ws360-teal-50); border-color: transparent; }
.ws360-company__name { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ws360-company__ad { align-self: flex-start; }
.ws360-app .ws360-btn.is-on { background: var(--ws360-teal-50); border-color: var(--ws360-teal); color: var(--ws360-teal-dark); }
.ws360-employer-cta { flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--ws360-s-4); }
.ws360-employer-cta > div { flex: 1 1 260px; display: flex; flex-direction: column; gap: 4px; }

/* ---------- Opportunity Radar: save button, tracker, preferences ---------- */
.ws360-app .ws360-save { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border-radius: var(--ws360-r-control); border: 1px solid var(--ws360-line-2); background: var(--ws360-surface); color: var(--ws360-ink); font: 600 14px/1 var(--ws360-font); cursor: pointer; }
.ws360-app .ws360-save:hover { border-color: var(--ws360-teal); color: var(--ws360-teal); }
.ws360-app .ws360-save.is-saved { background: var(--ws360-teal-50); border-color: var(--ws360-teal); color: var(--ws360-teal-dark); }
.ws360-app .ws360-save--small { min-height: 36px; font-size: 13px; padding: 0 12px; }
.ws360-app .ws360-save-msg { flex-basis: 100%; font-size: 13px; color: var(--ws360-slate); }
.ws360-job__actions { margin-top: 6px; }
.ws360-reasons { font-size: 12px; font-weight: 600; color: var(--ws360-teal-dark); }

.ws360-add > summary { list-style: none; align-self: flex-start; }
.ws360-add > summary::-webkit-details-marker { display: none; }
.ws360-add__form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--ws360-s-3); margin-top: var(--ws360-s-4); }
.ws360-add__form .ws360-row { grid-column: 1 / -1; }
.ws360-app.ws360-app input[type="text"],
.ws360-app.ws360-app input[type="url"],
.ws360-app.ws360-app input[type="tel"],
.ws360-app.ws360-app input[type="email"],
.ws360-app.ws360-app input[type="date"] { width: 100%; max-width: 100%; box-sizing: border-box; min-height: var(--ws360-tap); border: 1px solid var(--ws360-line-2); border-radius: var(--ws360-r-control); background-color: #ffffff; color: var(--ws360-ink); font: 400 16px/1.4 var(--ws360-font); padding: 0 14px; margin: 0; box-shadow: none; }
.ws360-app.ws360-app input[type="text"]:focus,
.ws360-app.ws360-app input[type="url"]:focus,
.ws360-app.ws360-app input[type="tel"]:focus,
.ws360-app.ws360-app input[type="email"]:focus,
.ws360-app.ws360-app input[type="date"]:focus { outline: none; border-color: var(--ws360-teal); box-shadow: 0 0 0 1px var(--ws360-teal); }

.ws360-filters { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; }
.ws360-app .ws360-filter { flex: none; min-height: 36px; padding: 0 14px; border-radius: var(--ws360-r-pill); border: 1px solid var(--ws360-line); background: var(--ws360-surface); color: var(--ws360-slate); font: 600 13px/1 var(--ws360-font); cursor: pointer; }
.ws360-app .ws360-filter.is-active { background: var(--ws360-ink); border-color: var(--ws360-ink); color: #ffffff; }
.ws360-tracker { display: flex; flex-direction: column; gap: var(--ws360-s-3); }
.ws360-app-item { gap: 10px; }
.ws360-app-item--interview { border-color: #c4b5fd; }
.ws360-app-item--offer { border-color: #abefc6; }
.ws360-app-item--rejected, .ws360-app-item--archived { opacity: 0.75; }
.ws360-app-item__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 12px; }
.ws360-app-item__title { display: flex; flex-direction: column; gap: 2px; flex: 1 1 240px; min-width: 0; }
.ws360-app.ws360-app select.ws360-status-select { width: auto; min-width: 150px; flex: none; font-weight: 600; }
.ws360-app-item__meta { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }
.ws360-closing { font-size: 13px; font-weight: 600; color: var(--ws360-slate); }
.ws360-closing.is-soon { color: var(--ws360-amber-dark); }
.ws360-closing.is-past { color: var(--ws360-quiet); text-decoration: line-through; }
.ws360-notes > summary { cursor: pointer; font-size: 14px; font-weight: 600; color: var(--ws360-teal); }
.ws360-notes[open] { display: flex; flex-direction: column; gap: 8px; }
.ws360-app-item__actions { border-top: 1px solid var(--ws360-line-soft); padding-top: 10px; }
.ws360-app .ws360-linkbtn { background: none; border: 0; padding: 0; min-height: 36px; font: 600 13px var(--ws360-font); color: var(--ws360-red); cursor: pointer; }

.ws360-checkgroup { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.ws360-checkgroup legend { font-size: 14px; font-weight: 600; padding: 0; margin-bottom: 8px; }
.ws360-checkgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 16px; }
.ws360-check-option { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 20px; min-height: 32px; cursor: pointer; }
.ws360-app.ws360-app .ws360-check-option input { width: 18px; height: 18px; margin: 1px 0 0; flex: none; accent-color: var(--ws360-teal); }
.ws360-count { color: var(--ws360-quiet); }
.ws360-danger { display: flex; flex-direction: column; gap: 10px; margin-top: var(--ws360-s-3); padding: var(--ws360-s-4); border: 1px solid #fecdca; border-radius: 12px; background: #fffbfa; }
.ws360-danger strong { color: var(--ws360-red-dark); }
.ws360-app .ws360-btn--danger { background: var(--ws360-red); color: #ffffff; }
.ws360-app .ws360-btn--danger:hover { background: var(--ws360-red-dark); color: #ffffff; }

/* ---------- Pro tools: labels, notice and "Next for this job" ---------- */
.ws360-pro-pill, .ws360-free-pill { display: inline-block; vertical-align: middle; margin-left: auto; font: 700 11px/16px var(--ws360-font); letter-spacing: 0.02em; padding: 1px 8px; border-radius: var(--ws360-r-pill); white-space: nowrap; }
.ws360-pro-pill { background: #fdecc8; color: var(--ws360-amber-dark); }
.ws360-free-pill { background: var(--ws360-green-50); color: var(--ws360-green-dark); }
.ws360-mode__box .ws360-pro-pill, .ws360-mode__box .ws360-free-pill, .ws360-action__text .ws360-pro-pill, .ws360-next__link .ws360-pro-pill { margin-left: 6px; }
.ws360-pro-note { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--ws360-s-3); border-color: #fedf89; background: var(--ws360-amber-50); }
.ws360-pro-note__text { display: flex; flex-direction: column; gap: 4px; flex: 1 1 260px; min-width: 0; }
.ws360-pro-note > .ws360-pro-pill { margin-left: 0; align-self: flex-start; }
.ws360-next__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--ws360-s-3); }
.ws360-app .ws360-next__link { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 14px; border: 1px solid var(--ws360-line); border-radius: 12px; color: var(--ws360-ink); text-decoration: none; }
.ws360-app .ws360-next__link:hover { border-color: var(--ws360-teal); }
.ws360-next .ws360-btn { align-self: flex-start; }
.ws360-lock { border-color: #fedf89; background: var(--ws360-amber-50); }
.ws360-lock__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ws360-s-2); }
.ws360-lock__head .ws360-pro-pill { margin-left: 0; }
.ws360-lock__list { margin: 0; padding-left: 20px; display: grid; gap: 6px; color: var(--ws360-ink); }
.ws360-lock .ws360-btn { align-self: flex-start; }
.ws360-lock__more { display: inline-block; font: 600 13px/20px var(--ws360-font); color: var(--ws360-amber-dark); }

/* ---------- Signed-out Career Hub: how it works and questions ---------- */
.ws360-steps-list { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; line-height: 1.55; color: var(--ws360-ink); }
.ws360-guest-faq details { border-top: 1px solid var(--ws360-line); padding: 12px 0; }
.ws360-guest-faq details:last-child { padding-bottom: 0; }
.ws360-guest-faq summary { cursor: pointer; font-weight: 600; font-size: 15px; line-height: 1.5; color: var(--ws360-ink); }
.ws360-guest-faq details p { margin: 8px 0 0; font-size: 15px; line-height: 1.6; color: var(--ws360-slate); }

/* ---------- Tablet and phone ---------- */
@media (max-width: 900px) {
	.ws360-app { grid-template-columns: minmax(0, 1fr); border-radius: 0; border-left: 0; border-right: 0; }
	.ws360-side { display: none; }
	.ws360-app.is-menu-open .ws360-side { display: flex; order: 2; }
	.ws360-app.is-menu-open .ws360-side .ws360-brand { display: none; }
	.ws360-main { padding: var(--ws360-s-4) var(--ws360-s-4) var(--ws360-s-5); gap: var(--ws360-s-4); }
	.ws360-card { padding: var(--ws360-s-4); }
	.ws360-app--embed { padding: var(--ws360-s-3); gap: var(--ws360-s-4); }
	.ws360-welcome { padding: var(--ws360-s-5) var(--ws360-s-4); }
	.ws360-pipeline { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
	.ws360-stat { font-size: 26px; line-height: 32px; }
	.ws360-tabbar { order: 3; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); position: sticky; bottom: 0; z-index: 20; background: var(--ws360-surface); border-top: 1px solid var(--ws360-line); padding: 6px 4px 10px; }
	.ws360-app .ws360-tabbar__item { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 48px; background: none; border: 0; padding: 0; font: 500 11px/1.2 var(--ws360-font); color: var(--ws360-slate); cursor: pointer; text-align: center; }
	.ws360-app .ws360-tabbar__item.is-active { color: var(--ws360-teal); font-weight: 600; }
	.ws360-main { order: 1; }
}
@media (max-width: 480px) {
	.ws360-app.ws360-app .ws360-signlist > li { flex-direction: column; gap: 6px; }
	.ws360-grid--actions { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ws360-s-3); }
	.ws360-app .ws360-action { flex-direction: column; gap: 10px; padding: 14px; }
	.ws360-action__text .ws360-small { display: none; }
	.ws360-grid--stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--ws360-s-2); }
	.ws360-grid--stats .ws360-card { padding: 12px; gap: 2px; }
	.ws360-grid--stats .ws360-muted { font-size: 12px; line-height: 16px; }
	.ws360-grid--stats .ws360-small { display: none; }
	.ws360-stat, .ws360-stat--amber { font-size: 20px; line-height: 28px; }
}

@media (prefers-reduced-motion: reduce) {
	.ws360-app * { transition: none !important; animation: none !important; }
}