:root {
  --ink: #151325;
  --muted: #666377;
  --line: #e9e7ef;
  --surface: #ffffff;
  --background: #f7f7fa;
  --purple: #6f52ed;
  --purple-soft: #eeeaff;
  --orange: #f29b60;
  --orange-soft: #fff0e6;
  --blue: #608fd8;
  --blue-soft: #eaf2ff;
  --green: #44a982;
  --green-soft: #e8f7f1;
  --sidebar: #171626;
  --shadow: 0 14px 40px rgba(27, 24, 58, .06);
  --radius: 20px;
  --font-sans: Inter, "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
  --font-display: Inter, "Segoe UI Variable Display", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; color: var(--ink); background: var(--background); font: 400 17px/1.6 var(--font-sans); -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.icon { flex: 0 0 auto; width: 1.1em; height: 1.1em; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
h1, h2, h3, h4, strong, b, .brand, .company-logo, .verdict-score { font-family: var(--font-display) !important; }
.page-title-with-icon,
.title-with-icon {
  display: flex;
  align-items: center;
  gap: 10px;
}
.page-title-with-icon {
  flex-wrap: wrap;
}
.title-icon {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  display: inline-grid;
  place-items: center;
  border-radius: 10px;
  background: var(--purple-soft);
  color: var(--purple);
  vertical-align: middle;
}
.title-icon svg {
  width: 19px;
  height: 19px;
}
.title-icon.purple { color: var(--purple); background: var(--purple-soft); }
.title-icon.orange { color: #cc6c35; background: var(--orange-soft); }
.title-icon.blue { color: #447fcf; background: var(--blue-soft); }
.title-icon.green { color: #258264; background: var(--green-soft); }
.page-title-with-icon .title-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
}
.page-title-with-icon .title-icon svg {
  width: 23px;
  height: 23px;
}

.app-shell { min-height: 100vh; --sidebar-width: 250px; }
.app-shell.is-sidebar-compact { --sidebar-width: 86px; }
.app-shell.is-sidebar-hidden { --sidebar-width: 0px; }
.app-menu-backdrop { display: none; }
.sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; width: var(--sidebar-width); padding: 31px 18px 20px; overflow: hidden; background: var(--sidebar); color: #aaa8bb; display: flex; flex-direction: column; transition: width .22s ease, padding .22s ease, transform .22s ease, visibility .22s ease; }
.brand { display: flex; align-items: center; gap: 11px; padding: 0 12px 35px; color: white; text-decoration: none; font: 800 25px/1 var(--font-display); letter-spacing: -.8px; }
.brand-name { display: inline-flex; align-items: baseline; gap: 1px; }
.brand-number {
  display: inline-block;
  margin: 0 1px;
  color: #a58cff;
  font-weight: 950;
  transform: rotate(-9deg) translateY(-1px);
  text-shadow: 0 5px 16px rgba(111, 82, 237, .45);
}
.brand-mark { width: 28px; height: 28px; border-radius: 8px; background: var(--purple); display: flex; align-items: flex-end; justify-content: center; gap: 2px; padding-bottom: 7px; transform: rotate(-4deg); }
.brand-mark span { display: block; width: 3px; border-radius: 2px; background: white; }
.brand-mark span:nth-child(1) { height: 7px; }.brand-mark span:nth-child(2) { height: 13px; }.brand-mark span:nth-child(3) { height: 10px; }
.sidebar .brand-cloud {
  position: relative;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow: hidden;
}
.sidebar .brand-cloud span {
  position: absolute;
  display: block;
  background: white;
  transform: rotate(-10deg);
}
.sidebar .brand-cloud span:nth-child(1) {
  width: 10px;
  height: 10px;
  left: 7px;
  top: 10px;
  border-radius: 50%;
}
.sidebar .brand-cloud span:nth-child(2) {
  width: 13px;
  height: 13px;
  left: 12px;
  top: 8px;
  border-radius: 50%;
}
.sidebar .brand-cloud span:nth-child(3) {
  width: 19px;
  height: 9px;
  left: 6px;
  top: 15px;
  border-radius: 999px;
}
.main-nav { display: grid; gap: 6px; }
.nav-item { display: flex; align-items: center; gap: 13px; min-height: 49px; padding: 0 14px; border-radius: 11px; color: #aaa8bb; font-size: 14px; font-weight: 600; text-decoration: none; transition: .2s ease; }
.nav-item svg { width: 20px; height: 20px; }
.nav-item:hover { color: white; background: rgba(255,255,255,.05); }
.nav-item.active { color: white; background: linear-gradient(100deg, #6f52ed, #7960ee); box-shadow: 0 10px 24px rgba(98, 73, 220, .28); }
.nav-item.is-disabled { cursor: not-allowed; }
.nav-item.is-disabled:not(.active) { opacity: .46; }
.nav-item.is-disabled:hover { color: #aaa8bb; background: transparent; }
.nav-count { margin-left: auto; min-width: 22px; height: 22px; padding: 0 6px; display: grid; place-items: center; background: rgba(255,255,255,.15); border-radius: 20px; font-size: 11px; }
.nav-live { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; border-radius: 20px; color: #bbb0ff; background: rgba(111,82,237,.15); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; }
.nav-live i { width: 6px; height: 6px; border-radius: 50%; background: #8d74ff; box-shadow: 0 0 0 3px rgba(141,116,255,.14); }
.nav-badge { margin-left: auto; padding: 3px 6px; border-radius: 12px; color: #c7bcff; background: rgba(111,82,237,.2); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; }
.nav-item.active .nav-badge { color: var(--purple); background: white; }
.mobile-bottom-nav { display: none; }
.sidebar-bottom { margin-top: auto; }
.progress-mini { padding: 16px; margin-bottom: 14px; border: 1px solid rgba(255,255,255,.08); border-radius: 13px; background: rgba(255,255,255,.025); }
.progress-mini-head { display: flex; justify-content: space-between; margin-bottom: 10px; font-size: 11px; color: #cfced7; }
.progress-mini-head strong { color: white; }
.progress-track { height: 6px; overflow: hidden; background: #e8e7ed; border-radius: 20px; }
.progress-track span { display: block; height: 100%; background: linear-gradient(90deg, var(--purple), #9c86ff); border-radius: inherit; transition: width .35s ease; }
.progress-mini .progress-track { background: rgba(255,255,255,.12); }
.progress-mini a { display: flex; justify-content: space-between; color: #a997ff; margin-top: 12px; font-size: 11px; text-decoration: none; }
.app-shell.is-sidebar-compact .sidebar { padding-inline: 14px; }
.app-shell.is-sidebar-compact .brand { justify-content: center; gap: 0; padding-inline: 0; }
.app-shell.is-sidebar-compact .brand-name,
.app-shell.is-sidebar-compact .nav-item > span,
.app-shell.is-sidebar-compact .sidebar-bottom { display: none; }
.app-shell.is-sidebar-compact .nav-item { justify-content: center; gap: 0; padding-inline: 0; }
.app-shell.is-sidebar-compact .nav-item svg { width: 22px; height: 22px; }
.app-shell.is-sidebar-hidden .sidebar { transform: translateX(-100%); visibility: hidden; pointer-events: none; }
.user-chip { display: flex; align-items: center; gap: 10px; color: var(--ink); font: inherit; }
.avatar { flex: 0 0 36px; height: 36px; border-radius: 50%; background: linear-gradient(145deg, #ffcb9d, #c58462); color: #3d271e; display: grid; place-items: center; font-weight: 800; font-size: 12px; }
.user-chip > span:nth-child(2) { min-width: 0; display: flex; flex-direction: column; }
.user-chip strong { color: var(--ink); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-chip small { color: var(--muted); font-size: 10px; margin-top: 2px; }

.main-column { padding-left: var(--sidebar-width); min-height: 100vh; transition: padding-left .22s ease; }
.topbar { height: 78px; position: sticky; top: 0; z-index: 15; padding: 0 clamp(24px, 4vw, 54px); display: flex; align-items: center; justify-content: space-between; gap: 20px; background: rgba(255,255,255,.92); border-bottom: 1px solid var(--line); backdrop-filter: blur(14px); }
.sidebar-mode-switcher { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 6px 18px rgba(27,24,58,.04); }
.sidebar-mode-switcher button { width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 10px; color: #7a7688; background: transparent; cursor: pointer; transition: background .18s ease, color .18s ease, box-shadow .18s ease; }
.sidebar-mode-switcher button:hover,
.sidebar-mode-switcher button:focus-visible { color: var(--purple); background: #f6f4fb; outline: none; }
.sidebar-mode-switcher button[aria-pressed="true"] { color: white; background: var(--purple); box-shadow: 0 8px 18px rgba(111,82,237,.22); }
.sidebar-mode-switcher svg { width: 18px; height: 18px; }
.search-wrap { position: relative; width: min(420px, 45vw); }
.search-wrap svg { position: absolute; left: 15px; top: 50%; width: 18px; transform: translateY(-50%); color: #9694a2; }
.search-wrap input { width: 100%; height: 42px; padding: 0 54px 0 44px; border: 1px solid transparent; border-radius: 11px; background: #f5f4f8; color: var(--ink); outline: none; transition: .2s; }
.search-wrap input:focus { background: white; border-color: #b9aaff; box-shadow: 0 0 0 3px var(--purple-soft); }
.search-wrap input::placeholder { color: #aaa8b4; font-size: 13px; }
kbd { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #9997a4; border: 1px solid #dedce4; background: white; padding: 3px 6px; border-radius: 5px; font: 10px inherit; }
.top-actions { display: flex; align-items: center; gap: 12px; }
.user-menu { position: relative; }
.user-menu-toggle { min-height: 48px; max-width: 245px; padding: 5px 12px 5px 6px; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: 0 6px 18px rgba(27,24,58,.04); cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.user-menu-toggle:hover, .user-menu-toggle:focus-visible { border-color: #cfc7f7; box-shadow: 0 8px 22px rgba(73,55,150,.1); transform: translateY(-1px); outline: none; }
.user-menu-toggle .avatar { flex-basis: 36px; }
.user-menu-chevron { flex: 0 0 15px; width: 15px; height: 15px; color: var(--muted); transition: transform .18s ease; }
.user-menu-toggle[aria-expanded="true"] .user-menu-chevron { transform: rotate(90deg); }
.user-dropdown { position: absolute; top: calc(100% + 10px); right: 0; z-index: 40; width: 240px; display: grid; gap: 3px; padding: 8px; border: 1px solid var(--line); border-radius: 16px; background: white; box-shadow: 0 20px 45px rgba(27,24,58,.16); }
.user-dropdown button { width: 100%; min-height: 42px; display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 0; border-radius: 10px; color: var(--ink); background: transparent; font: 700 13px var(--font-sans); text-align: left; cursor: pointer; }
.user-dropdown button:hover, .user-dropdown button:focus-visible { color: var(--purple); background: #f6f4fb; outline: none; }
.user-dropdown .icon { flex: 0 0 18px; width: 18px; height: 18px; }
.user-menu-separator { height: 1px; margin: 5px 4px; background: var(--line); }
.user-dropdown button.danger { color: #b15656; }
.user-dropdown button.danger:hover, .user-dropdown button.danger:focus-visible { color: #974a4a; background: #fff3f3; }
.icon-button { width: 38px; height: 38px; border: 0; background: transparent; display: grid; place-items: center; border-radius: 10px; cursor: pointer; }
.icon-button:hover { background: #f2f1f5; }
.icon-button svg { width: 20px; }
.notification-button, .dashboard-shortcut { position: relative; background: white; }
.dashboard-shortcut { border: 1px solid var(--line); }
.notification-button span { position: absolute; width: 7px; height: 7px; top: 7px; right: 7px; border-radius: 50%; background: #ef7269; border: 1px solid white; }
.dashboard-shortcut { color: var(--purple); }
.dashboard-shortcut:hover, .dashboard-shortcut:focus-visible, .dashboard-shortcut.active { color: white; background: var(--purple); border-color: var(--purple); box-shadow: 0 8px 18px rgba(111,82,237,.22); outline: none; }
.mobile-menu { display: none; }
.button { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 10px; padding: 0 17px; font-size: 13px; font-weight: 700; cursor: pointer; transition: transform .18s, box-shadow .18s, background .18s; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: white; background: var(--purple); box-shadow: 0 8px 18px rgba(111,82,237,.22); }
.button-primary:hover { background: #6247db; }
.button-dark { color: white; background: var(--ink); }
.button-green { color: white; background: var(--green); box-shadow: 0 8px 18px rgba(68,169,130,.22); }
.button-green:hover { background: #358f6e; }
.button-green.is-added { color: var(--green); background: var(--green-soft); box-shadow: none; }
.button-light { color: #173629; background: #7ee692; box-shadow: 0 8px 18px rgba(126, 230, 146, .24); }
.button-light:hover { background: #6fdd86; }
.button-current-plan,
.button-current-plan:disabled {
  color: var(--green);
  background: var(--green-soft);
  opacity: 1;
  box-shadow: inset 0 0 0 1px rgba(68,169,130,.22);
}
.button-danger { color: #a84b4b; background: #fff0f0; box-shadow: none; }
.button-danger:hover { background: #ffe4e4; }
.button:disabled, .button[aria-disabled="true"] { opacity: .52; cursor: not-allowed; transform: none; box-shadow: none; }
.button.button-current-plan,
.button.button-current-plan:disabled,
.button.button-current-plan[aria-disabled="true"] {
  color: var(--green);
  background: var(--green-soft);
  opacity: 1;
  box-shadow: inset 0 0 0 1px rgba(68,169,130,.22);
}
.button-full { width: 100%; }

.auth-screen {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: 28px;
  background:
    radial-gradient(circle at 86% 16%, rgba(255, 255, 255, .26), transparent 29%),
    radial-gradient(circle at 8% 8%, rgba(126, 255, 205, .22), transparent 24%),
    linear-gradient(135deg, #18162d 0%, #4b2ccf 47%, #5f8fdd 100%);
}
.auth-screen::before,
.auth-screen::after {
  content: "";
  position: absolute;
  pointer-events: none;
}
.auth-screen::before {
  inset: auto -8% -30% 46%;
  height: 360px;
  border-radius: 50%;
  background: rgba(68, 169, 130, .28);
  filter: blur(24px);
}
.auth-screen::after {
  right: 5%;
  top: 11%;
  width: 150px;
  height: 150px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 34px;
  transform: rotate(12deg);
}
.auth-card {
  position: relative;
  z-index: 1;
  width: min(980px, 100%);
  max-width: calc(100vw - 56px);
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 420px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 28px;
  background: white;
  box-shadow: 0 34px 96px rgba(30, 20, 96, .3);
}
.auth-hero {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 560px;
  overflow: hidden;
  padding: 50px;
  color: white;
  background:
    radial-gradient(circle at 18% 12%, rgba(255, 255, 255, .24), transparent 30%),
    radial-gradient(circle at 88% 82%, rgba(126, 255, 205, .2), transparent 29%),
    linear-gradient(140deg, #211a52 0%, #6f52ed 54%, #9b86ff 112%);
}
.auth-hero::before {
  content: "";
  position: absolute;
  inset: 12% -22% auto auto;
  width: 260px;
  height: 260px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .14);
  filter: blur(2px);
}
.auth-hero > * {
  position: relative;
  z-index: 1;
}
.auth-hero .brand-mark {
  margin-bottom: 28px;
  background: rgba(255, 255, 255, .18);
  box-shadow: 0 16px 34px rgba(25, 14, 82, .22);
}
.auth-hero h1 {
  max-width: 420px;
  margin: 8px 0 12px;
  font: 900 42px/1.05 var(--font-display);
  letter-spacing: -1.6px;
}
.auth-hero p {
  max-width: 480px;
  margin: 0;
  color: rgba(255, 255, 255, .86);
}
.auth-note {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  gap: 9px;
  max-width: 440px;
  margin-top: 32px;
  padding: 13px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 13px;
  color: #f8f5ff;
  background: rgba(255, 255, 255, .12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
  font-size: 13px;
}
.auth-note a {
  color: #fff;
  font-weight: 900;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.auth-note a:hover,
.auth-note a:focus-visible {
  color: #dfffe7;
}
.auth-form {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  padding: 45px;
  background: linear-gradient(180deg, #fff 0%, #fbfaff 100%);
}
.auth-form h2 {
  margin: 4px 0 5px;
  font: 800 28px var(--font-display);
}
.auth-form p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}
.auth-form .button-primary {
  background: linear-gradient(135deg, #6f52ed, #9b86ff);
  box-shadow: 0 12px 26px rgba(111, 82, 237, .28);
}
.auth-form .button-primary:hover {
  background: linear-gradient(135deg, #6247db, #8f77ff);
}
.auth-name-field { display: none; }
.auth-name-field.visible { display: grid; }
.auth-message { min-height: 22px; color: var(--muted); font-weight: 700; }
.auth-message[data-type="error"] { color: #b15656; }
.auth-message[data-type="success"] { color: var(--green); }
.auth-toggle { align-self: center; }

main { padding: 0 clamp(24px, 4vw, 54px) 60px; }
.view { display: none; max-width: 1440px; margin: 0 auto; animation: view-in .3s ease; }
.view.active { display: block; }
@keyframes view-in { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.page-head { min-height: 152px; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-top: 16px; }
.page-head h1 { margin: 4px 0 7px; font: 800 clamp(27px, 3vw, 37px) "Manrope", sans-serif; letter-spacing: -1.3px; }
.page-head p { margin: 0; color: var(--muted); font-size: 14px; }
.section-kicker { color: var(--purple); font-size: 10px !important; font-weight: 800; letter-spacing: 1.6px; }
.welcome-head h1 span { font-size: .75em; }
.focus-pill { padding: 11px 15px; border: 1px solid var(--line); background: white; border-radius: 30px; color: #636173; font-size: 12px; box-shadow: 0 4px 15px rgba(30,28,50,.03); }
.focus-pill span { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px var(--orange-soft); }

.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.stat-card { min-height: 116px; padding: 21px; display: flex; align-items: center; gap: 16px; background: white; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 7px 25px rgba(36,32,65,.035); }
.stat-icon { flex: 0 0 43px; height: 43px; display: grid; place-items: center; border-radius: 12px; }
.stat-icon svg { width: 21px; }
.accent-purple .stat-icon { background: var(--purple-soft); color: var(--purple); }.accent-orange .stat-icon { background: var(--orange-soft); color: #dd8150; }.accent-blue .stat-icon { background: var(--blue-soft); color: var(--blue); }.accent-green .stat-icon { background: var(--green-soft); color: var(--green); }
.stat-card > div:last-child { display: grid; grid-template-columns: auto 1fr; align-items: baseline; }
.stat-card span { grid-column: 1 / -1; color: var(--muted); font-size: 11px; }
.stat-card strong { font: 800 28px "Manrope", sans-serif; margin-right: 8px; }
.stat-card small { color: #9997a5; font-size: 10px; }
.stat-card small b { color: var(--green); }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(275px, .82fr); gap: 18px; margin-top: 18px; }
.panel { background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.priority-panel, .next-panel, .skills-preview { padding: 25px; }
.panel-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 19px; }
.panel-head h2 { margin: 4px 0 0; font: 700 18px "Manrope", sans-serif; letter-spacing: -.3px; }
.text-button { border: 0; padding: 4px; background: transparent; color: var(--purple); font-size: 11px; font-weight: 700; cursor: pointer; }
.featured-job { display: flex; gap: 17px; padding: 19px; border: 1px solid #e3dffa; border-radius: 15px; background: linear-gradient(120deg, #fff, #fbfaff); cursor: pointer; }
.company-logo { flex: 0 0 48px; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; font: 800 14px/1 var(--font-display); }
.logo-gradient { background: linear-gradient(145deg, #2b2a42, #7562d4); color: white; box-shadow: inset 0 0 20px rgba(255,255,255,.12); }
.featured-main { flex: 1; min-width: 0; }
.job-title-row { display: flex; justify-content: space-between; gap: 16px; }
.job-title-row h3 { margin: 0 0 5px; font: 700 16px "Manrope", sans-serif; }
.job-title-row p, .job-list-content > p { margin: 0; color: var(--muted); font-size: 11px; }
.tag { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 6px; background: #f3f2f7; color: #696779; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; }
.tag-new { margin-left: 5px; color: var(--green); background: var(--green-soft); vertical-align: middle; }
.tag-interview { color: #d16f3e; background: var(--orange-soft); }
.score-ring, .coverage-ring, .completion-ring { --score: 50; flex: 0 0 auto; width: 58px; height: 58px; position: relative; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--purple) calc(var(--score) * 1%), #ebe9f1 0); }
.score-ring::before, .coverage-ring::before, .completion-ring::before { content: ""; position: absolute; inset: 5px; background: white; border-radius: 50%; }
.score-ring > span, .coverage-ring > span, .completion-ring > span { z-index: 1; display: flex; align-items: baseline; }
.score-ring strong { font: 800 16px "Manrope", sans-serif; }.score-ring small { color: var(--muted); font-size: 7px; }
.job-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 13px 0; }
.job-insight { display: flex; align-items: flex-start; gap: 10px; padding: 11px 13px; background: var(--purple-soft); border-radius: 9px; color: #5c5088; }
.insight-icon { color: var(--purple); }
.job-insight p { margin: 0; font-size: 10px; line-height: 1.5; }
.job-insight strong { display: block; color: #443a70; }
.featured-footer { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; }
.featured-actions { display: flex; align-items: center; gap: 8px; }
.stage { display: flex; align-items: center; gap: 9px; }
.stage-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 4px var(--orange-soft); }
.stage > span:last-child { display: flex; flex-direction: column; }
.stage small { color: #aaa7b4; font-size: 7px; letter-spacing: .7px; }.stage strong { font-size: 10px; margin-top: 2px; }
.task-card { display: flex; gap: 13px; padding: 15px 0 18px; border-bottom: 1px solid var(--line); }
.task-date { flex: 0 0 50px; height: 58px; display: grid; place-items: center; align-content: center; background: var(--orange-soft); color: #d47240; border-radius: 11px; }
.task-date strong { font: 800 20px "Manrope", sans-serif; line-height: 1; }.task-date span { font-size: 7px; font-weight: 800; margin-top: 3px; }
.task-card h3 { font-size: 12px; margin: 8px 0 4px; }.task-card p { color: var(--muted); font-size: 9px; margin: 0; }
.task-progress { margin: 17px 0 14px; }.task-progress > div:first-child { display: flex; justify-content: space-between; color: var(--muted); font-size: 10px; margin-bottom: 8px; }.task-progress strong { color: var(--ink); }
.tip-card { display: flex; gap: 10px; padding: 13px; margin-top: 14px; background: #fff9e9; border-radius: 10px; }
.tip-card p { margin: 0; font-size: 9px; line-height: 1.5; color: #766d53; }.tip-card strong { display: block; color: #5d5540; }
.latest-jobs-panel { margin-top: 18px; padding: 25px; }
.latest-jobs-panel .panel-head { margin-bottom: 16px; }
.latest-jobs-count { padding: 6px 10px; border-radius: 20px; color: var(--purple); background: var(--purple-soft); font-size: 9px; font-weight: 800; }
.latest-jobs-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.latest-job-card { position: relative; min-width: 0; padding: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(135deg, #fff 65%, #faf9ff); }
.latest-job-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--purple); }
.latest-job-card-orange::before { background: var(--orange); }
.latest-job-source { display: flex; align-items: center; gap: 9px; }
.source-logo { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: white; background: #2557a7; font-size: 11px; font-weight: 800; text-transform: lowercase; }
.latest-job-source div { display: flex; flex-direction: column; }
.latest-job-source strong { font-size: 10px; }
.latest-job-source small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.latest-job-content { padding: 16px 0 14px; }
.latest-job-content h3 { margin: 9px 0 5px; font: 700 14px/1.35 var(--font-display); }
.latest-job-content > p { margin: 0; color: var(--muted); font-size: 10px; }
.latest-job-meta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 13px; color: #777483; font-size: 8px; }
.latest-job-meta span { display: inline-flex; align-items: center; gap: 4px; }
.latest-job-meta .icon { width: 12px; height: 12px; }
.latest-job-link { display: inline-flex; align-items: center; gap: 7px; color: var(--purple); font-size: 10px; font-weight: 800; text-decoration: none; }
.latest-job-link .icon { width: 13px; height: 13px; transition: transform .2s; }
.latest-job-link:hover .icon { transform: translateX(3px); }
.dashboard-charts { margin-top: 18px; }
.dashboard-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 14px; padding: 0 3px; }
.dashboard-section-head h2 { margin: 4px 0 3px; font: 700 20px var(--font-display); }
.dashboard-section-head p { margin: 0; color: var(--muted); font-size: 10px; }
.chart-period { padding: 6px 10px; border: 1px solid var(--line); border-radius: 20px; color: var(--muted); background: white; font-size: 8px; font-weight: 700; }
.charts-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(250px, .75fr); gap: 15px; }
.chart-card { min-width: 0; padding: 21px; }
.chart-card-wide { grid-row: span 2; }
.chart-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 13px; }
.chart-label { color: var(--purple); font-size: 8px; font-weight: 800; letter-spacing: 1.2px; }
.chart-card h3 { margin: 4px 0 0; font: 700 14px var(--font-display); }
.chart-insight { padding: 6px 8px; border-radius: 8px; color: var(--muted); background: #f5f4f7; font-size: 8px; }
.chart-insight strong { color: var(--green); }
.chart-wrap { position: relative; height: 245px; }
.chart-card-wide .chart-wrap { height: 440px; }
.chart-wrap-donut { height: 185px; }
.chart-mini-legend { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 12px; margin-top: 8px; }
.chart-mini-legend span { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 8px; }
.chart-mini-legend i { width: 7px; height: 7px; border-radius: 50%; }
.chart-mini-legend strong { margin-left: auto; color: var(--ink); }
.chart-fallback { display: grid; min-height: 120px; place-items: center; margin: 0; color: var(--muted); font-size: 10px; text-align: center; }
.skills-preview { margin-top: 18px; }
.skill-bars { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.skill-bar-item > div:first-child { display: flex; justify-content: space-between; font-size: 11px; margin-bottom: 8px; }.skill-bar-item strong { color: var(--purple); }

.filter-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }
.filter-tabs { display: flex; gap: 7px; }
.filter-tabs button { border: 1px solid var(--line); background: white; padding: 9px 13px; border-radius: 9px; color: var(--muted); font-size: 11px; font-weight: 600; cursor: pointer; }
.filter-tabs button.active { background: var(--ink); color: white; border-color: var(--ink); }.filter-tabs span { margin-left: 5px; opacity: .7; }
.view-toggle { display: flex; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: white; }
.view-toggle button {
  width: 30px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  border-radius: 6px;
  color: #a2a0aa;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease;
}
.view-toggle button:hover,
.view-toggle button:focus-visible {
  color: var(--purple);
  background: var(--purple-soft);
  box-shadow: 0 7px 16px rgba(111, 82, 237, .14);
  transform: translateY(-1px);
  outline: none;
}
.view-toggle button.active {
  background: #efedf4;
  color: var(--ink);
}
.view-toggle button.active:hover,
.view-toggle button.active:focus-visible {
  color: var(--purple);
  background: #e8e3ff;
}
.view-toggle button:active {
  transform: translateY(0) scale(.97);
}
.view-toggle svg { width: 15px; }
.jobs-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; }
.jobs-layout > div:first-child { display: grid; gap: 10px; }
.job-list-card { position: relative; display: flex; gap: 17px; padding: 24px; background: white; border: 1px solid var(--line); border-radius: 17px; box-shadow: var(--shadow); cursor: pointer; transition: .2s; }
.job-list-card:hover { transform: translateY(-2px); border-color: #cfc6fa; }.job-list-card.selected { border-left: 4px solid var(--purple); }
.job-list-content { flex: 1; min-width: 0; }.job-list-head { display: flex; justify-content: space-between; align-items: center; }.tag-status { background: var(--purple-soft); color: var(--purple); }.tag-status i { width: 5px; height: 5px; background: currentColor; border-radius: 50%; }
.tag-status-study { color: var(--purple); background: var(--purple-soft); }
.tag-status-applied { color: #3974c9; background: var(--blue-soft); }
.tag-status-interview { color: #c66e42; background: var(--orange-soft); }
.tag-status-offer { color: var(--green); background: var(--green-soft); }
.tag-status-closed { color: #74717f; background: #efedf4; }
.tag-status-analyzing { color: #7b5ae8; background: #f0ebff; }
.tag-status-failed { color: #b15656; background: #ffecec; }
.muted { color: var(--muted); font-size: 9px; }.job-list-content h2 { margin: 12px 0 5px; font: 700 18px "Manrope", sans-serif; }
.job-meta { display: flex; flex-wrap: wrap; gap: 17px; margin: 17px 0; color: #6c6978; font-size: 10px; }
.match-row { display: flex; align-items: center; gap: 12px; }.match-row > div { flex: 1; }.match-row span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 9px; }.match-row strong { color: var(--purple); font: 700 16px "Manrope"; }
.job-card-action { margin-top: 12px; margin-right: 42px; margin-left: auto; }
.bookmark { position: absolute; right: 20px; bottom: 20px; width: 30px; height: 30px; border: 0; border-radius: 8px; color: #bbb8c4; background: #f5f4f7; cursor: pointer; }.bookmark.active { color: var(--purple); }
.empty-suggestion { display: flex; align-items: center; gap: 15px; padding: 20px 24px; border: 1px dashed #d5d2de; border-radius: 15px; color: var(--muted); background: #fff; }
.empty-suggestion .suggestion-icon { flex: 0 0 35px; width: 35px; height: 35px; padding: 8px; color: var(--purple); background: var(--purple-soft); border-radius: 10px; }
.empty-suggestion div { flex: 1; }
.empty-suggestion strong { color: var(--ink); font-size: 11px; }
.empty-suggestion p { margin: 3px 0 0; font-size: 10px; }
.empty-suggestion-action { flex: 0 0 auto; }
.pipeline-card { padding: 24px; }.pipeline-card h2 { margin: 5px 0 18px; font: 700 18px "Manrope"; }
.pipeline-donut { position: relative; width: 145px; height: 145px; margin: 8px auto 22px; display: grid; place-items: center; background: conic-gradient(#efedf4 0 100%); border-radius: 50%; }.pipeline-donut::before { content: ""; position: absolute; width: 102px; height: 102px; background: white; border-radius: 50%; }.pipeline-donut > div { z-index: 1; text-align: center; }.pipeline-donut strong { display: block; font: 800 29px "Manrope"; }.pipeline-donut span { color: var(--muted); font-size: 9px; }
.pipeline-legend { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }.pipeline-legend li { display: flex; justify-content: space-between; font-size: 10px; }.pipeline-legend li > span { display: flex; align-items: center; gap: 8px; color: var(--muted); }.dot { width: 7px; height: 7px; border-radius: 50%; }.purple { background: var(--purple); }.blue { background: var(--blue); }.orange { background: var(--orange); }.green { background: var(--green); }
.pipeline-tip { display: flex; gap: 10px; padding: 12px; margin-top: 20px; background: var(--purple-soft); border-radius: 10px; color: var(--purple); }.pipeline-tip p { margin: 0; font-size: 9px; color: #6c638b; }.pipeline-tip strong { display: block; color: #514577; }

.job-list-card.closed { opacity: .72; }
.job-list-card.analyzing { cursor: default; background: linear-gradient(135deg, #fff, #f8f5ff); border-color: #dcd4ff; }
.job-list-card.analyzing:hover { transform: none; }
.analyzing-job-content h2 { margin-bottom: 4px; }
.analysis-card-state { display: inline-flex; align-items: center; gap: 8px; width: fit-content; margin-top: 10px; padding: 8px 10px; border-radius: 999px; color: #6250a5; background: var(--purple-soft); font-size: 12px; font-weight: 800; }
.analysis-card-state span { width: 8px; height: 8px; border-radius: 50%; background: var(--purple); box-shadow: 0 0 0 0 rgba(111,82,237,.35); animation: analysis-pulse 1.2s infinite; }
@keyframes analysis-pulse {
  0% { box-shadow: 0 0 0 0 rgba(111,82,237,.35); }
  70% { box-shadow: 0 0 0 8px rgba(111,82,237,0); }
  100% { box-shadow: 0 0 0 0 rgba(111,82,237,0); }
}
.job-card-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 12px; margin-right: 42px; }
.job-card-actions .job-card-action { margin: 0; }
.job-card-actions .text-button:disabled { color: #aaa5b5; cursor: not-allowed; }
.muted-dot { background: #aaa5b5; }

.watch-page-head { min-height: 142px; }
.watch-live-pill { display: inline-flex; align-items: center; gap: 9px; padding: 10px 14px; border: 1px solid #d9d3f8; border-radius: 999px; color: #5f5877; background: white; font-size: 13px; font-weight: 700; box-shadow: 0 5px 18px rgba(32,28,58,.04); }
.watch-live-pill span { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px var(--green-soft); animation: live-pulse 2s infinite; }
@keyframes live-pulse { 50% { box-shadow: 0 0 0 8px rgba(68,169,130,0); } }
.watch-layout { max-width: 1120px; display: grid; grid-template-columns: minmax(0, 760px) 300px; align-items: start; gap: 24px; margin: 0 auto; }
.watch-main { min-width: 0; }
.announcements-search-panel { padding: 0; margin-bottom: 10px; overflow: visible; }
.announcements-search-panel summary { min-height: 50px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 14px; color: var(--ink); list-style: none; cursor: pointer; }
.announcements-search-panel summary::-webkit-details-marker { display: none; }
.announcements-search-panel summary span { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 850; }
.announcements-search-panel summary .icon { width: 17px; height: 17px; color: var(--purple); }
.announcements-search-panel summary small { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 750; }
.announcements-search-panel summary small::after { content: ""; width: 8px; height: 8px; border-right: 2px solid #9c98aa; border-bottom: 2px solid #9c98aa; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.announcements-search-panel[open] summary { border-bottom: 1px solid var(--line); }
.announcements-search-panel[open] summary small::after { transform: rotate(225deg) translate(-2px, -1px); }
.announcements-search { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) 130px auto; gap: 12px; align-items: end; padding: 12px; margin-bottom: 0; }
.announcements-search label { display: grid; gap: 7px; color: #5f5b6c; font-size: 13px; font-weight: 800; }
.announcements-search input, .announcements-search select { min-height: 42px; width: 100%; border: 1px solid var(--line); border-radius: 12px; padding: 0 12px; color: var(--ink); background: #faf9fc; font: inherit; font-size: 14px; }
.announcements-search input:focus, .announcements-search select:focus { outline: 2px solid rgba(111,82,237,.2); border-color: #b9abff; background: white; }
.announcements-search .announcements-check { min-height: 42px; display: flex; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid var(--line); border-radius: 12px; background: #faf9fc; }
.announcements-search .announcements-check input { min-height: auto; width: auto; accent-color: var(--purple); }
.announcements-search .button { min-height: 42px; }
.announcements-contracts { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 8px; padding: 10px; margin: 0; border: 1px solid var(--line); border-radius: 14px; background: #faf9fc; }
.announcements-contracts legend { width: 100%; margin-bottom: 2px; color: #5f5b6c; font-size: 13px; font-weight: 850; }
.announcements-contracts label { display: inline-flex; width: fit-content; gap: 0; }
.announcements-contracts input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; clip-path: inset(50%); }
.announcements-contracts span { display: inline-flex; align-items: center; min-height: 34px; padding: 0 11px; border: 1px solid var(--line); border-radius: 999px; color: #625d70; background: white; font-size: 13px; font-weight: 800; cursor: pointer; }
.announcements-contracts input:checked + span { color: var(--purple); background: var(--purple-soft); border-color: #cbbfff; }
.announcements-contracts input:focus-visible + span { outline: 3px solid rgba(111, 82, 237, .32); outline-offset: 2px; }
.watch-filters { position: sticky; top: 90px; z-index: 8; display: flex; gap: 8px; padding: 10px; margin-bottom: 14px; overflow-x: auto; border: 1px solid var(--line); border-radius: 14px; background: rgba(247,247,250,.94); backdrop-filter: blur(12px); scrollbar-width: none; }
.watch-filters::-webkit-scrollbar { display: none; }
.watch-filters button { min-height: 38px; padding: 0 14px; border: 1px solid transparent; border-radius: 999px; color: var(--muted); background: transparent; font-size: 13px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.watch-filters button:hover { color: var(--ink); background: white; }
.watch-filters button.active { color: white; background: var(--ink); box-shadow: 0 5px 14px rgba(21,19,37,.15); }
#announcements .watch-filters { transition: opacity .2s ease, transform .2s ease, visibility .2s ease; will-change: transform, opacity; }
#announcements .watch-filters.is-scroll-hidden { opacity: 0; visibility: hidden; transform: translateY(-110%); pointer-events: none; }
.watch-feed { display: grid; gap: 18px; }
.watch-post { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: white; box-shadow: 0 12px 34px rgba(27,24,58,.06); transition: opacity .22s ease, transform .22s ease; }
.watch-post.removing { opacity: 0; transform: scale(.98); }
.watch-post-head { display: flex; align-items: center; gap: 11px; padding: 16px 18px; }
.watch-source-avatar { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: white; background: linear-gradient(145deg, #29263e, var(--purple)); font-size: 12px; font-weight: 800; letter-spacing: .3px; }
.watch-post-head > div { min-width: 0; display: flex; flex: 1; flex-direction: column; }
.watch-post-head strong { overflow: hidden; font-size: 14px; white-space: nowrap; text-overflow: ellipsis; }
.watch-post-head > div span { display: flex; align-items: center; gap: 5px; margin-top: 2px; color: var(--muted); font-size: 12px; }
.watch-post-head .icon { width: 13px; height: 13px; }
.watch-match { padding: 6px 9px; border-radius: 999px; color: var(--green); background: var(--green-soft); font-size: 11px; font-weight: 800; white-space: nowrap; }
.watch-post-image { display: block; width: 100%; height: min(350px, 75vw); max-height: 350px; object-fit: cover; background: #ecebf1; }
.watch-post-body { padding: 18px; }
.watch-post-labels { display: flex; flex-wrap: wrap; gap: 7px; }
.watch-post-body h2 { margin: 12px 0 5px; font-size: 22px; line-height: 1.3; letter-spacing: -.4px; }
.watch-post-location { display: flex; align-items: center; gap: 6px; margin: 0 0 13px !important; color: var(--muted) !important; font-size: 13px !important; }
.watch-post-location .icon { color: var(--purple); }
.watch-post-body > p { margin: 0; color: #595668; font-size: 14px; line-height: 1.65; }
.watch-post-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px; }
.watch-post-tags span { padding: 7px 10px; border-radius: 8px; color: #5f5b6c; background: #f4f3f7; font-size: 12px; font-weight: 700; }
.watch-post-actions { display: grid; grid-template-columns: auto auto auto 1fr; align-items: center; gap: 4px; padding: 10px 12px; border-top: 1px solid var(--line); }
.watch-post-actions button, .watch-post-actions a { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 12px; border: 0; border-radius: 9px; color: #656174; background: transparent; font-size: 13px; font-weight: 700; text-decoration: none; cursor: pointer; }
.watch-post-actions button:hover { color: var(--ink); background: #f5f4f8; }
.watch-post-actions button[aria-pressed="true"] { color: var(--purple); background: var(--purple-soft); }
.watch-post-actions button:disabled { color: #8f8a9c; cursor: wait; opacity: .75; }
.watch-post-actions a { color: #656174; background: transparent; }
.watch-post-actions a:hover { color: var(--ink); background: #f5f4f8; }
.watch-post-actions .announcement-analyze-cta { justify-self: end; color: white; background: linear-gradient(135deg, #6f52ed, #9b6dff); box-shadow: 0 10px 24px rgba(111,82,237,.22); }
.watch-post-actions .announcement-analyze-cta:hover { color: white; background: linear-gradient(135deg, #5d45d8, #8d5cff); transform: translateY(-1px); box-shadow: 0 14px 30px rgba(111,82,237,.28); }
.watch-post-actions .announcement-analyze-cta:disabled { color: white; background: linear-gradient(135deg, #8b7fd0, #aaa0dc); transform: none; box-shadow: none; }
.watch-resource-card { border-color: #dfd8ff; background: linear-gradient(180deg, #fff 0%, #fbfaff 100%); }
.watch-resource-card.is-video { border-color: rgba(111,82,237,.28); }
.watch-resource-avatar { background: linear-gradient(145deg, #6f52ed, #9b86ff); box-shadow: 0 10px 22px rgba(111,82,237,.18); }
.watch-resource-type { padding: 6px 10px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 11px; font-weight: 850; white-space: nowrap; }
.watch-resource-media { width: 100%; height: min(350px, 75vw); max-height: 350px; overflow: hidden; background: #ecebf1; }
.watch-resource-video { position: relative; height: min(350px, 56.25vw); background: #151325; }
.watch-resource-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.watch-resource-image { background: linear-gradient(135deg, #eeeaff, #f8f5ff); }
.watch-resource-placeholder { display: grid; place-items: center; align-content: center; gap: 10px; color: white; background: radial-gradient(circle at 28% 22%, rgba(255,255,255,.28), transparent 28%), linear-gradient(135deg, #211a52, #6f52ed 58%, #9b86ff); font-weight: 850; text-align: center; }
.watch-resource-placeholder .icon { width: 34px; height: 34px; }
.watch-post-labels .tag-resource { color: #5e47cf; background: var(--purple-soft); }
.watch-resource-meta { color: #5f5877 !important; }
.watch-resource-actions { grid-template-columns: 1fr auto; }
.watch-resource-context { display: inline-flex; align-items: center; min-height: 42px; color: var(--muted); font-size: 13px; font-weight: 750; }
.watch-post-actions .watch-resource-link { color: white; background: linear-gradient(135deg, var(--ink), #3b335e); box-shadow: 0 10px 24px rgba(21,19,37,.15); }
.watch-post-actions .watch-resource-link:hover { color: white; background: linear-gradient(135deg, #211d39, #514779); transform: translateY(-1px); }
.paid-feature-popover-wrap { position: relative; justify-self: end; display: inline-flex; }
.watch-post-actions .announcement-analyze-cta[aria-disabled="true"]:not(:disabled) { color: white; background: linear-gradient(135deg, #8b7fd0, #aaa0dc); box-shadow: none; cursor: help; }
.watch-post-actions .announcement-analyze-cta[aria-disabled="true"]:not(:disabled):hover,
.watch-post-actions .announcement-analyze-cta[aria-disabled="true"]:not(:disabled):focus-visible { background: linear-gradient(135deg, #7f72c5, #9e92cf); transform: none; box-shadow: 0 12px 28px rgba(73,55,150,.16); }
.paid-feature-popover { position: absolute; right: 0; bottom: calc(100% + 12px); z-index: 45; width: min(320px, 78vw); padding: 14px; border: 1px solid rgba(111,82,237,.18); border-radius: 16px; color: var(--ink); background: white; box-shadow: 0 22px 45px rgba(31, 41, 55, .18); opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; transition-delay: .1s; pointer-events: none; }
.paid-feature-popover::before { content: ""; position: absolute; left: 0; right: 0; bottom: -18px; height: 18px; }
.paid-feature-popover::after { content: ""; position: absolute; right: 24px; bottom: -7px; width: 12px; height: 12px; border-right: 1px solid rgba(111,82,237,.18); border-bottom: 1px solid rgba(111,82,237,.18); background: white; transform: rotate(45deg); }
.paid-feature-popover strong { display: block; margin-bottom: 7px; font-size: 14px; line-height: 1.25; }
.paid-feature-popover span { display: block; color: #5e5a6d; font-size: 14px; line-height: 1.45; }
.watch-post-actions .paid-feature-popover a { width: fit-content; min-height: 34px; margin-top: 12px; padding: 0 12px; border-radius: 999px; color: white; background: var(--purple); font-size: 13px; box-shadow: 0 10px 22px rgba(111,82,237,.2); }
.watch-post-actions .paid-feature-popover a:hover,
.watch-post-actions .paid-feature-popover a:focus-visible { color: white; background: #6247db; outline: none; }
.paid-feature-popover-wrap:hover .paid-feature-popover,
.paid-feature-popover-wrap:focus-within .paid-feature-popover { opacity: 1; visibility: visible; transform: translateY(0); transition-delay: 0s; pointer-events: auto; }
.watch-sidebar { position: sticky; top: 96px; padding: 23px; }
.watch-sidebar h2 { margin: 7px 0 20px; font-size: 19px; }
.watch-profile { display: flex; align-items: center; gap: 11px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.watch-profile > div { display: flex; flex-direction: column; }
.watch-profile strong { font-size: 13px; }
.watch-profile small { color: var(--muted); font-size: 11px; }
.watch-criteria { display: flex; flex-wrap: wrap; gap: 7px; padding: 18px 0; }
.watch-criteria span { padding: 7px 9px; border-radius: 8px; color: #615879; background: var(--purple-soft); font-size: 11px; font-weight: 700; }
.watch-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 17px; }
.watch-summary div { padding: 13px 8px; border: 1px solid var(--line); border-radius: 11px; text-align: center; }
.watch-summary strong { display: block; font-size: 21px; }
.watch-summary span { color: var(--muted); font-size: 10px; }
.watch-note { display: flex; align-items: flex-start; gap: 7px; margin: 15px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.watch-note .icon { margin-top: 2px; color: var(--green); }
.watch-empty { padding: 42px 24px; border: 1px dashed #d7d3e2; border-radius: 18px; background: white; text-align: center; }
.watch-empty[hidden] { display: none; }
.watch-empty .title-icon { margin: 0 auto 12px; }
.watch-empty h2 { margin: 0 0 5px; font-size: 19px; }
.watch-empty p { margin: 0 0 18px; color: var(--muted); font-size: 13px; }
.announcement-profile-gate { padding: 26px; background: radial-gradient(circle at 94% 0%, rgba(111,82,237,.13), transparent 30%), linear-gradient(145deg, #fff, #fbfaff); }
.announcement-profile-gate-head { display: flex; gap: 16px; align-items: flex-start; }
.announcement-profile-gate-head .title-icon { flex: 0 0 auto; }
.announcement-profile-gate h2 { margin: 6px 0 9px; font: 850 27px/1.12 var(--font-display); letter-spacing: -.9px; }
.announcement-profile-gate p { max-width: 68ch; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.announcement-profile-gate-progress { display: grid; gap: 10px; margin: 22px 0; padding: 16px; border: 1px solid #ded7ff; border-radius: 16px; background: white; }
.announcement-profile-gate-progress > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.announcement-profile-gate-progress strong { color: var(--purple); font: 900 25px var(--font-display); }
.announcement-profile-gate-progress span { color: var(--muted); font-size: 13px; font-weight: 850; }
.announcement-profile-gate-actions { display: flex; align-items: center; gap: 16px; }
.announcement-profile-gate-actions .button { flex: 0 0 auto; }
.announcement-profile-gate-actions p { font-size: 13px; }
.watch-sentinel { min-height: 100px; display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--muted); font-size: 13px; }
.watch-sentinel[hidden] { display: none; }
.watch-loader { width: 22px; height: 22px; border: 2px solid #ddd9ef; border-top-color: var(--purple); border-radius: 50%; animation: watch-spin .8s linear infinite; opacity: .35; }
.watch-sentinel.loading .watch-loader { opacity: 1; }
@keyframes watch-spin { to { transform: rotate(360deg); } }

.skills-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-bottom: 18px; }.skills-summary article { display: flex; gap: 13px; align-items: center; padding: 18px; border: 1px solid var(--line); background: white; border-radius: 14px; }.summary-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; }.summary-icon.purple { background: var(--purple-soft); color: var(--purple); }.summary-icon.green { background: var(--green-soft); color: var(--green); }.summary-icon.orange { background: var(--orange-soft); color: var(--orange); }.skills-summary strong { display: block; font: 800 20px "Manrope"; }.skills-summary article div span { color: var(--muted); font-size: 10px; }
.skills-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 20px; }.matrix-panel, .opportunity-panel { padding: 25px; }.save-state { color: var(--green); font-size: 10px; }.save-state::before { content: "✓"; margin-right: 5px; }
.matrix-legend { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 12px 185px; color: #a09da9; font-size: 8px; text-align: center; }
.matrix-row { display: grid; grid-template-columns: 185px 1fr 34px; align-items: center; min-height: 55px; border-top: 1px solid #f0eef3; }.matrix-row:first-child { border-top: 0; }.matrix-name { display: flex; align-items: center; gap: 9px; font-size: 11px; font-weight: 600; }.matrix-name i { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 8px; font-style: normal; background: #f2efff; color: var(--purple); }.level-selector { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 0 10px; }.level-selector button { height: 9px; border: 0; background: #eceaf0; border-radius: 20px; cursor: pointer; }.level-selector button.filled { background: var(--purple); }.level-selector button.current { box-shadow: 0 0 0 3px var(--purple-soft); }.remove-skill { border: 0; background: transparent; color: #c4c1cb; cursor: pointer; }
.opportunity-panel > p { color: var(--muted); font-size: 10px; }.opportunity-panel h2 { margin: 5px 0; font: 700 18px "Manrope"; }.coverage-ring, .completion-ring { width: 128px; height: 128px; margin: 27px auto; }.coverage-ring::before, .completion-ring::before { inset: 9px; }.coverage-ring > span, .completion-ring > span { flex-direction: column; align-items: center; }.coverage-ring strong, .completion-ring strong { font: 800 25px "Manrope"; }.coverage-ring small, .completion-ring small { color: var(--muted); font-size: 9px; }.opportunity-panel h3 { font-size: 11px; margin: 0 0 11px; }.priority-skill { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); font-size: 10px; }.priority-skill span { color: var(--orange); font-weight: 700; }.opportunity-panel .button { margin-top: 17px; }

.profile-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 20px; }.profile-summary { align-self: start; padding: 30px 24px; text-align: center; }.large-avatar { position: relative; width: 88px; height: 88px; margin: 0 auto; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(145deg, #f5bf91, #9b5d45); color: white; font: 800 23px "Manrope"; }.large-avatar button { position: absolute; right: -2px; bottom: 1px; width: 27px; height: 27px; border: 3px solid white; border-radius: 50%; color: white; background: var(--purple); font-size: 10px; }.profile-summary h2 { margin: 14px 0 4px; font: 700 18px "Manrope"; }.profile-summary > p { color: var(--muted); font-size: 11px; }.profile-summary .completion-ring { width: 105px; height: 105px; margin: 25px auto 18px; }.profile-background-summary { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin: 0 0 18px; }.profile-background-summary span { max-width: 100%; overflow: hidden; padding: 7px 10px; border-radius: 999px; color: #625a83; background: var(--purple-soft); font-size: 12px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }.profile-hint { padding-top: 16px; border-top: 1px solid var(--line); line-height: 1.5; }
.profile-form { padding: 28px; }.form-section { padding: 2px 0 27px; margin-bottom: 27px; border-bottom: 1px solid var(--line); }.form-section-head { display: flex; gap: 12px; margin-bottom: 19px; }.form-section-head > span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; color: var(--purple); background: var(--purple-soft); font-size: 9px; font-weight: 800; }.form-section h2 { margin: 0 0 3px; font: 700 15px "Manrope"; }.form-section p { margin: 0; color: var(--muted); font-size: 9px; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.span-2 { grid-column: 1 / -1; } label { display: grid; gap: 7px; color: #5d5a6b; font-size: 10px; font-weight: 600; } input, select, textarea { width: 100%; border: 1px solid #dedce5; border-radius: 9px; background: white; color: var(--ink); padding: 0 12px; outline: none; transition: .2s; } input, select { height: 42px; } textarea { padding-top: 11px; line-height: 1.5; resize: vertical; } input:focus, select:focus, textarea:focus { border-color: #9d8bea; box-shadow: 0 0 0 3px var(--purple-soft); }
.target-roles-field { display: grid; gap: 8px; color: #5d5a6b; font-size: 13px; font-weight: 700; }
.target-roles-field > label { font-size: 13px; }
.target-roles-field small { color: var(--muted); font-size: 12px; font-weight: 700; line-height: 1.45; }
.tag-editor { display: grid; gap: 10px; padding: 12px; border: 1px solid #dedce5; border-radius: 13px; background: #faf9fc; }
.tag-editor-tags { display: flex; flex-wrap: wrap; gap: 8px; min-height: 34px; }
.tag-editor-empty { display: inline-flex; align-items: center; color: var(--muted); font-size: 13px; font-weight: 700; }
.target-role-tag { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 9px 0 12px; border: 1px solid #d8d0ff; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 13px; font-weight: 850; }
.target-role-tag button { width: 20px; height: 20px; display: inline-grid; place-items: center; padding: 0; border: 0; border-radius: 50%; color: var(--purple); background: rgba(111,82,237,.12); font-size: 15px; line-height: 1; cursor: pointer; }
.target-role-tag button:hover { color: white; background: var(--purple); }
.tag-editor-entry { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.tag-editor-entry .button { min-height: 42px; }
.contract-fieldset { border: 0; padding: 16px 0 0; margin: 0; }.contract-fieldset legend { margin-bottom: 9px; font-size: 10px; color: #5d5a6b; font-weight: 600; }.check-pill { position: relative; display: inline-block; margin-right: 8px; }.check-pill input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; clip-path: inset(50%); }.check-pill span { display: inline-flex; padding: 8px 14px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); font-size: 10px; cursor: pointer; }.check-pill input:checked + span { color: var(--purple); background: var(--purple-soft); border-color: #cbbfff; }
.priority-chips { display: flex; flex-wrap: wrap; gap: 8px; }.priority-chips button { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #faf9fc; padding: 9px 12px; border-radius: 9px; font-size: 10px; cursor: grab; }.priority-chip span { min-width: 22px; height: 22px; display: inline-grid; place-items: center; border-radius: 7px; color: var(--purple); background: var(--purple-soft); font-weight: 800; }.priority-chip.dragging { opacity: .45; cursor: grabbing; }.priority-chip:active { cursor: grabbing; }

.journey-layout { display: grid; grid-template-columns: 310px minmax(0, 1fr); gap: 20px; align-items: start; }.journey-score-card { position: sticky; top: 96px; padding: 27px; }.journey-score-card h2 { margin: 10px 0 7px; font: 800 22px var(--font-display); }.journey-score-card > p { margin: 0 0 18px; color: var(--muted); font-size: 13px; line-height: 1.55; }.journey-score-ring { --score: 0; position: relative; width: 138px; height: 138px; display: grid; place-items: center; margin: 20px auto; border-radius: 50%; background: conic-gradient(var(--purple) calc(var(--score) * 1%), #eceaf2 0); }.journey-score-ring::before { content: ""; position: absolute; width: 112px; height: 112px; border-radius: 50%; background: white; }.journey-score-ring span { position: relative; z-index: 1; display: grid; text-align: center; }.journey-score-ring strong { color: var(--purple); font: 900 28px var(--font-display); }.journey-score-ring small { color: var(--muted); font-size: 10px; }.journey-progress-meta { display: flex; align-items: baseline; gap: 8px; margin: 14px 0; color: var(--muted); font-size: 12px; }.journey-progress-meta strong { color: var(--ink); font: 900 22px var(--font-display); }.journey-preview { padding: 15px; border: 1px solid var(--line); border-radius: 14px; background: #faf9fc; }.journey-preview strong { display: block; margin-bottom: 6px; font-size: 14px; }.journey-preview p { margin: 0 0 8px; color: var(--muted); font-size: 12px; line-height: 1.55; }.journey-preview small { color: var(--purple); font-weight: 800; }.journey-form { padding: 28px; }.journey-experience-toolbar { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 14px; }.journey-experience-toolbar p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.5; }.journey-experiences-editor { display: grid; gap: 14px; }.journey-experience-card { position: relative; min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; }.journey-experience-card legend { padding: 0 7px; color: var(--purple); font-size: 10px; font-weight: 800; }

.documents-layout { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 20px; align-items: start; }.documents-sidebar { display: grid; gap: 18px; }.storage-card, .folders-panel, .documents-browser { padding: 25px; }.storage-card h2 { margin: 5px 0 18px; font: 800 22px var(--font-display); }.storage-gauge { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }.storage-gauge-ring { --storage-percent: 0%; position: relative; width: 106px; height: 106px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--purple) var(--storage-percent), #eceaf2 0); }.storage-gauge-ring::before { content: ""; position: absolute; inset: 14px; border-radius: 50%; background: white; }.storage-gauge-ring span { position: relative; z-index: 1; color: var(--purple); font: 800 22px var(--font-display); }.storage-gauge strong { display: block; font-size: 15px; }.storage-gauge small { color: var(--muted); font-size: 12px; }.storage-track { margin-bottom: 18px; }.folder-form { padding: 14px; margin-bottom: 15px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; }.folder-form > div { display: grid; grid-template-columns: 1fr 46px; gap: 8px; }.folder-form .button { padding: 0; }.folder-list { display: grid; gap: 10px; }.folder-card { display: grid; gap: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: white; }.folder-card.active { border-color: #cfc5fa; background: #fbfaff; box-shadow: 0 8px 22px rgba(111,82,237,.08); }.folder-select { display: flex; align-items: center; gap: 10px; width: 100%; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }.folder-select > span:nth-child(2) { display: grid; gap: 2px; min-width: 0; }.folder-select strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }.folder-select small { color: var(--muted); font-size: 11px; }.folder-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--purple); background: var(--purple-soft); }.folder-inline-actions { display: flex; gap: 8px; padding-left: 46px; }.folder-inline-actions button, .documents-folder-actions .text-button { border: 0; color: var(--purple); background: transparent; font-size: 11px; font-weight: 700; cursor: pointer; }.folder-inline-actions button:disabled, .documents-folder-actions button:disabled { color: #bdb9c9; cursor: not-allowed; }.text-button.danger, .folder-inline-actions button:last-child:not(:disabled) { color: #b15656; }.documents-browser-head { display: flex; justify-content: space-between; gap: 18px; padding-bottom: 20px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }.documents-browser-head h2 { margin: 5px 0 3px; font: 800 24px var(--font-display); }.documents-browser-head p { margin: 0; color: var(--muted); font-size: 13px; }.documents-folder-actions { display: flex; align-items: flex-start; gap: 10px; }.documents-file-list { display: grid; gap: 12px; }.document-file-card { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }.document-file-icon { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 13px; color: #447fcf; background: var(--blue-soft); font-size: 12px; font-weight: 800; }.document-file-card h3 { margin: 0 0 4px; font-size: 16px; }.document-file-card p { margin: 0; color: var(--muted); font-size: 12px; }.document-file-card time { color: #9a97a5; font-size: 11px; white-space: nowrap; }.documents-empty { padding: 42px 24px; border: 1px dashed #d7d3e2; border-radius: 18px; text-align: center; background: #faf9fc; }.documents-empty .title-icon { margin: 0 auto 12px; }.documents-empty h3 { margin: 0 0 4px; font-size: 18px; }.documents-empty p { margin: 0; color: var(--muted); font-size: 13px; }

.settings-hero { min-height: 250px; display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 26px; align-items: center; padding: 38px; margin: 22px 0; overflow: hidden; border: 1px solid #d9d2ff; border-radius: 28px; color: white; background: radial-gradient(circle at 86% 10%, rgba(255,255,255,.24), transparent 30%), radial-gradient(circle at 10% 88%, rgba(68,169,130,.2), transparent 28%), linear-gradient(135deg, #171626, #6f52ed); box-shadow: 0 22px 55px rgba(43,35,105,.18); }
.settings-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; color: #f4f0ff; background: rgba(255,255,255,.1); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.settings-hero h1 { max-width: 820px; margin: 16px 0 14px; font: 900 clamp(34px, 5vw, 58px)/1.02 var(--font-display); letter-spacing: -2.3px; }
.settings-hero p { max-width: 730px; margin: 0; color: #ebe7ff; font-size: 17px; line-height: 1.65; }
.settings-hero-card { padding: 24px; border: 1px solid rgba(255,255,255,.18); border-radius: 22px; background: rgba(255,255,255,.11); backdrop-filter: blur(12px); }
.settings-hero-card .title-icon { margin-bottom: 16px; background: white; }
.settings-hero-card strong { display: block; margin-bottom: 7px; color: white; font-size: 20px; }
.settings-hero-card p { color: #eeeaff; font-size: 14px; word-break: break-word; }
.settings-plan-pill { display: inline-flex; margin-top: 15px; padding: 7px 11px; border-radius: 999px; color: white; background: rgba(255,255,255,.16); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .4px; }
.settings-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: start; }
.settings-card { padding: 25px; }
.settings-card-head { display: flex; align-items: center; gap: 13px; margin-bottom: 19px; }
.settings-card-head h2 { margin: 4px 0 0; font: 850 24px/1.1 var(--font-display); letter-spacing: -.8px; }
.settings-account-list { display: grid; gap: 10px; margin: 0 0 18px; }
.settings-account-list div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 13px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; }
.settings-account-list dt { color: var(--muted); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.settings-account-list dd { min-width: 0; margin: 0; color: var(--ink); font-size: 14px; font-weight: 800; overflow-wrap: anywhere; }
.settings-preference-list { display: grid; gap: 12px; }
.settings-switch { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 15px; background: #faf9fc; cursor: pointer; }
.settings-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.settings-switch > span { grid-row: span 2; width: 46px; height: 26px; border-radius: 999px; background: #d9d5e2; transition: .2s; }
.settings-switch > span::before { content: ""; display: block; width: 20px; height: 20px; margin: 3px; border-radius: 50%; background: white; box-shadow: 0 2px 8px rgba(31,28,47,.18); transition: transform .2s; }
.settings-switch input:checked + span { background: var(--purple); }
.settings-switch input:checked + span::before { transform: translateX(20px); }
.settings-switch input:focus-visible + span { box-shadow: 0 0 0 3px var(--purple-soft); }
.settings-switch strong { font-size: 15px; line-height: 1.25; }
.settings-switch small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.settings-note { margin: 15px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.settings-security-card { grid-column: 1 / -1; }
.settings-security-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.settings-security-grid article { padding: 16px; border: 1px solid var(--line); border-radius: 15px; background: #faf9fc; }
.settings-security-grid strong { display: block; margin-bottom: 7px; font-size: 15px; }
.settings-security-grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.settings-rgpd { grid-column: 1 / -1; padding: 0; overflow: hidden; }
.settings-rgpd summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 19px 24px; cursor: pointer; list-style: none; }
.settings-rgpd summary::-webkit-details-marker { display: none; }
.settings-rgpd summary strong { display: block; margin-top: 4px; font: 850 20px var(--font-display); letter-spacing: -.5px; }
.settings-rgpd summary .icon { color: var(--purple); transition: transform .2s; }
.settings-rgpd[open] summary .icon { transform: rotate(90deg); }
.settings-rgpd-body { padding: 0 24px 24px; border-top: 1px solid var(--line); }
.settings-rgpd-intro { display: flex; gap: 14px; padding: 18px 0; }
.settings-rgpd-intro h2 { margin: 0 0 5px; font: 850 24px var(--font-display); }
.settings-rgpd-intro p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.settings-rgpd-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.settings-rgpd-box { display: grid; gap: 12px; align-content: start; padding: 18px; border: 1px solid var(--line); border-radius: 16px; background: #faf9fc; }
.settings-rgpd-box h3 { margin: 0; font: 850 19px var(--font-display); letter-spacing: -.4px; }
.settings-rgpd-box p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.settings-rgpd-box label { color: #5d5a6b; font-size: 13px; line-height: 1.45; }
.settings-rgpd-box input[type="text"] { height: 42px; }
.settings-danger-box { border-color: #f1d2d2; background: #fff8f8; }
.settings-delete-consent { display: flex !important; grid-template-columns: none; align-items: flex-start; gap: 9px; }
.settings-delete-consent input { width: 17px; height: 17px; margin-top: 1px; accent-color: #a84b4b; }
.settings-action-status { min-height: 21px; margin: 14px 0 0; color: var(--muted); font-size: 13px; font-weight: 800; }
.app-reduced-motion * { transition-duration: .01ms !important; animation-duration: .01ms !important; scroll-behavior: auto !important; }
.app-compact-content main { gap: 14px; }
.app-compact-content .panel { box-shadow: 0 10px 24px rgba(24,22,37,.04); }

#subscription { max-width: 100%; overflow-x: hidden; }
.subscription-hero { min-height: 250px; display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 26px; align-items: center; padding: 38px; margin: 22px 0; overflow: hidden; border: 1px solid #d9d2ff; border-radius: 28px; color: white; background: radial-gradient(circle at 86% 10%, rgba(255,255,255,.24), transparent 30%), radial-gradient(circle at 10% 88%, rgba(68,169,130,.2), transparent 28%), linear-gradient(135deg, #171626, #6f52ed); box-shadow: 0 22px 55px rgba(43,35,105,.18); }
.subscription-hero > div { min-width: 0; }
.subscription-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; color: #f4f0ff; background: rgba(255,255,255,.1); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.subscription-hero h1 { max-width: 820px; margin: 16px 0 14px; font: 900 clamp(34px, 5vw, 58px)/1.02 var(--font-display); letter-spacing: -2.3px; }
.subscription-hero p { max-width: 760px; margin: 0; color: #ebe7ff; font-size: 17px; line-height: 1.65; }
.subscription-hero-card { min-width: 0; max-width: 100%; padding: 24px; border: 1px solid rgba(255,255,255,.18); border-radius: 22px; background: rgba(255,255,255,.11); backdrop-filter: blur(12px); }
.subscription-hero-card .title-icon { margin-bottom: 16px; background: white; }
.subscription-hero-card strong { display: block; margin-bottom: 7px; color: white; font-size: 22px; }
.subscription-hero-card p { color: #eeeaff; font-size: 14px; }
.subscription-status-pill { display: inline-flex; margin-top: 15px; padding: 7px 11px; border-radius: 999px; color: white; background: rgba(255,255,255,.16); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .4px; }
.subscription-layout { width: 100%; max-width: 100%; min-width: 0; display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 18px; align-items: start; }
.subscription-current-card, .subscription-upgrade-card, .subscription-invoices-card { min-width: 0; max-width: 100%; padding: 25px; overflow: hidden; }
.subscription-card-head { min-width: 0; display: flex; align-items: center; gap: 13px; margin-bottom: 19px; }
.subscription-card-head > div { min-width: 0; }
.subscription-card-head h2 { margin: 4px 0 0; font: 850 24px/1.1 var(--font-display); letter-spacing: -.8px; }
.subscription-price-line { display: flex; align-items: baseline; gap: 7px; margin-bottom: 12px; }
.subscription-price-line strong { font: 900 36px/1 var(--font-display); letter-spacing: -1.4px; }
.subscription-price-line span { color: var(--muted); font-size: 14px; font-weight: 800; }
.subscription-current-card > p, .subscription-upgrade-card > p { margin: 0 0 18px; color: var(--muted); font-size: 14px; line-height: 1.6; }
.subscription-facts { display: grid; gap: 10px; margin: 0; }
.subscription-facts div { display: grid; grid-template-columns: 135px minmax(0, 1fr); gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; }
.subscription-facts dt { color: var(--muted); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.subscription-facts dd { min-width: 0; margin: 0; color: var(--ink); font-size: 14px; font-weight: 800; overflow-wrap: anywhere; }
.subscription-upgrade-card { background: linear-gradient(135deg, #fff, #fbfaff); border-color: #cfc5fa; }
.subscription-upgrade-card h3 { margin: 13px 0 8px; font: 850 25px var(--font-display); letter-spacing: -.8px; }
.subscription-upgrade-card .button { width: fit-content; min-width: 190px; }
.subscription-invoices-card { grid-column: 1 / -1; }
.subscription-invoices-head { justify-content: space-between; align-items: flex-end; }
.subscription-loading { color: var(--muted); font-size: 13px; font-weight: 900; }
.subscription-table-wrap { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden; border: 1px solid var(--line); border-radius: 18px; background: white; -webkit-overflow-scrolling: touch; }
.subscription-table { width: 100%; min-width: 690px; border-collapse: collapse; }
.subscription-table th, .subscription-table td { padding: 15px 17px; border-bottom: 1px solid var(--line); text-align: left; }
.subscription-table th { color: var(--ink); background: #faf9fc; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.subscription-table td { color: #504c5f; font-size: 14px; font-weight: 700; }
.subscription-table tr:last-child td { border-bottom: 0; }
.subscription-invoice-link { display: inline-flex; align-items: center; gap: 7px; color: var(--purple); font-size: 13px; font-weight: 900; text-decoration: none; }
.subscription-invoice-link:hover { text-decoration: underline; }
.subscription-invoice-status { display: inline-flex; padding: 6px 9px; border-radius: 999px; color: #39785f; background: var(--green-soft); font-size: 12px; font-weight: 900; }
.subscription-invoice-status.is-open { color: var(--orange); background: var(--orange-soft); }
.subscription-invoice-status.is-void, .subscription-invoice-status.is-uncollectible { color: #a84b4b; background: #fff0f0; }
.subscription-empty { padding: 34px 22px; border: 1px dashed #d7d3e2; border-radius: 18px; background: #faf9fc; text-align: center; }
.subscription-empty .title-icon { margin: 0 auto 12px; }
.subscription-empty h3 { margin: 0 0 5px; font-size: 18px; }
.subscription-empty p { margin: 0; color: var(--muted); font-size: 14px; }
.subscription-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 14px; }
.subscription-pagination span { color: var(--muted); font-size: 13px; font-weight: 900; }
.subscription-cancel-card { grid-column: 1 / -1; min-width: 0; max-width: 100%; padding: 0; overflow: hidden; }
.subscription-cancel-card summary { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 24px; cursor: pointer; list-style: none; }
.subscription-cancel-card summary::-webkit-details-marker { display: none; }
.subscription-cancel-card summary > span { min-width: 0; }
.subscription-cancel-card summary strong { display: block; margin-top: 4px; font: 850 20px var(--font-display); letter-spacing: -.5px; overflow-wrap: anywhere; }
.subscription-cancel-card summary .icon { color: var(--purple); transition: transform .2s; }
.subscription-cancel-card[open] summary .icon { transform: rotate(90deg); }
.subscription-cancel-body { padding: 0 24px 24px; border-top: 1px solid var(--line); }
.subscription-cancel-body p { max-width: 760px; margin: 18px 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.subscription-action-status { min-height: 21px; color: var(--muted) !important; font-size: 13px !important; font-weight: 800; }

.help-hero { min-height: 260px; display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 26px; align-items: center; padding: 38px; margin: 22px 0; overflow: hidden; border: 1px solid #d9d2ff; border-radius: 28px; color: white; background: radial-gradient(circle at 86% 10%, rgba(255,255,255,.24), transparent 30%), radial-gradient(circle at 12% 90%, rgba(68,169,130,.22), transparent 28%), linear-gradient(135deg, #171626, #6f52ed); box-shadow: 0 22px 55px rgba(43,35,105,.18); }
.help-badge { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; color: #f4f0ff; background: rgba(255,255,255,.1); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }
.help-hero h1 { max-width: 830px; margin: 16px 0 14px; font: 900 clamp(34px, 5vw, 58px)/1.02 var(--font-display); letter-spacing: -2.3px; }
.help-hero p { max-width: 760px; margin: 0; color: #ebe7ff; font-size: 17px; line-height: 1.65; }
.help-hero-card { padding: 24px; border: 1px solid rgba(255,255,255,.18); border-radius: 22px; background: rgba(255,255,255,.11); backdrop-filter: blur(12px); }
.help-hero-card .title-icon { margin-bottom: 16px; background: white; }
.help-hero-card strong { display: block; margin-bottom: 8px; color: white; font-size: 20px; }
.help-hero-card p { color: #eeeaff; font-size: 14px; line-height: 1.6; }
.help-section { margin-top: 22px; }
.help-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 16px; }
.help-section-head h2 { margin: 5px 0 0; font: 850 28px/1.12 var(--font-display); letter-spacing: -1px; }
.help-soft-pill { padding: 8px 12px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 13px; font-weight: 900; white-space: nowrap; }
.help-journey { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.help-step { position: relative; min-width: 0; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 14px; padding: 20px; border: 1px solid var(--line); border-radius: 20px; background: white; box-shadow: var(--shadow); }
.help-step::after { content: ""; position: absolute; inset: auto 20px 0 20px; height: 4px; border-radius: 999px 999px 0 0; background: linear-gradient(90deg, var(--purple), #44a982); opacity: .8; }
.help-step-number { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; color: var(--purple); background: var(--purple-soft); font: 900 13px var(--font-display); }
.help-step h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font: 850 19px/1.2 var(--font-display); letter-spacing: -.45px; }
.help-step h3 .title-icon { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 11px; }
.help-step p { margin: 0; color: #5a5668; font-size: 14px; line-height: 1.62; }
.help-availability { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px; }
.help-availability span, .help-plan-tags span { display: inline-flex; align-items: center; min-height: 28px; padding: 6px 9px; border-radius: 999px; font-size: 12px; font-weight: 900; line-height: 1.15; }
.help-availability .is-included, .help-plan-tags span { color: #39785f; background: var(--green-soft); }
.help-availability .is-premium { color: var(--purple); background: var(--purple-soft); }
.help-availability .is-platinum { color: white; background: var(--ink); }
.help-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.help-plan-card { padding: 23px; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: var(--shadow); }
.help-plan-card-featured { border-color: #cfc5fa; background: linear-gradient(135deg, #fff, #fbfaff); box-shadow: 0 18px 45px rgba(111,82,237,.13); }
.help-plan-card h3 { margin: 14px 0 8px; font: 850 23px/1.12 var(--font-display); letter-spacing: -.8px; }
.help-plan-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.help-limits { margin-top: 16px; padding: 23px; }
.help-limits h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 13px; font: 850 20px var(--font-display); }
.help-limits ul { display: grid; gap: 10px; padding: 0; margin: 0; list-style: none; }
.help-limits li { position: relative; padding-left: 24px; color: #504c5f; font-size: 14px; line-height: 1.55; }
.help-limits li::before { content: ""; position: absolute; left: 3px; top: .58em; width: 8px; height: 8px; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 5px var(--orange-soft); }
.help-feature-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.help-feature-card { min-width: 0; display: flex; flex-direction: column; padding: 22px; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: var(--shadow); }
.help-feature-card h3 { margin: 15px 0 8px; font: 850 22px/1.12 var(--font-display); letter-spacing: -.65px; }
.help-feature-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.help-plan-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; padding-top: 17px; }
.help-plan-tags .muted-tag { color: #716b80; background: #f2eff7; }

#pricing { max-width: 100%; overflow-x: hidden; }
.pricing-hero { min-height: 230px; display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 24px; align-items: center; padding: 36px; margin: 22px 0 22px; overflow: hidden; border: 1px solid #d9d2ff; border-radius: 28px; color: white; background: radial-gradient(circle at 82% 10%, rgba(255,255,255,.22), transparent 30%), linear-gradient(135deg, #171626, #6f52ed); box-shadow: 0 22px 55px rgba(43,35,105,.18); }.pricing-hero > div { min-width: 0; }.pricing-hero h1 { max-width: 780px; margin: 8px 0 12px; font: 900 clamp(33px, 5vw, 58px)/1.02 var(--font-display); letter-spacing: -2.4px; overflow-wrap: anywhere; }.pricing-hero p { max-width: 720px; margin: 0; color: #e5e0ff; }.pricing-hero-card { min-width: 0; max-width: 100%; padding: 22px; border: 1px solid rgba(255,255,255,.18); border-radius: 20px; background: rgba(255,255,255,.1); backdrop-filter: blur(12px); }.pricing-hero-card .title-icon { margin-bottom: 16px; background: white; }.pricing-hero-card strong { display: block; margin-bottom: 6px; color: white; font-size: 18px; }.pricing-hero-card p { color: #eeeaff; font-size: 14px; }
.pricing-grid { width: 100%; max-width: 100%; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; align-items: stretch; }.pricing-card { position: relative; display: flex; flex-direction: column; min-width: 0; max-width: 100%; min-height: 100%; padding: 24px; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: var(--shadow); }.pricing-card-featured { border: 2px solid var(--purple); transform: translateY(-10px); box-shadow: 0 24px 60px rgba(111,82,237,.18); }.pricing-card-pro { background: linear-gradient(180deg, #fff, #fbfaff); }.popular-badge { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); padding: 7px 12px; border-radius: 999px; color: white; background: var(--purple); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; box-shadow: 0 10px 22px rgba(111,82,237,.25); white-space: nowrap; }.pricing-card-head { min-height: 152px; min-width: 0; }.pricing-card h2 { margin: 12px 0 8px; font: 850 24px/1.08 var(--font-display); letter-spacing: -.9px; overflow-wrap: anywhere; }.pricing-card p { margin: 0; color: var(--muted); font-size: 14px; overflow-wrap: anywhere; }.plan-pill { display: inline-flex; width: fit-content; max-width: 100%; padding: 6px 10px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; overflow-wrap: anywhere; }.plan-pill-premium { color: white; background: var(--purple); }.plan-pill-platinum { color: white; background: var(--ink); }.plan-pill-pro { color: #b7602f; background: var(--orange-soft); }.plan-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; margin: 6px 0 18px; }.plan-price strong { font: 900 32px/1 var(--font-display); letter-spacing: -1.3px; }.plan-price span { color: var(--muted); font-size: 13px; }.pricing-features { display: grid; gap: 11px; padding: 0; margin: 22px 0 0; list-style: none; }.pricing-features li { position: relative; min-width: 0; padding-left: 25px; color: #4c495a; font-size: 13px; line-height: 1.45; overflow-wrap: anywhere; }.pricing-features li::before { content: ""; position: absolute; left: 0; top: .25em; width: 15px; height: 15px; border-radius: 50%; background: var(--green-soft); }.pricing-features li::after { content: ""; position: absolute; left: 5px; top: calc(.25em + 4px); width: 5px; height: 8px; border: solid var(--green); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ai-feature-badge { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 3px 7px; border: 1px solid rgba(111,82,237,.18); border-radius: 999px; color: var(--purple); background: linear-gradient(135deg, #f4f0ff, #effdf3); font-size: 12px; font-weight: 950; letter-spacing: .35px; white-space: nowrap; vertical-align: middle; }
.ai-feature-badge::before { content: "✦"; color: var(--green); font-size: 12px; line-height: 1; }
.pricing-features li.has-ai { color: #3f3a55; font-weight: 750; }
.pricing-compare { min-width: 0; max-width: 100%; margin-top: 20px; padding: 26px; overflow: hidden; }.pricing-compare-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }.pricing-compare-head > div { min-width: 0; }.pricing-compare-head h2 { margin: 4px 0 0; font: 850 24px var(--font-display); letter-spacing: -.8px; overflow-wrap: anywhere; }.pricing-table-legend { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px 16px; color: var(--muted); font-size: 12px; font-weight: 800; }.pricing-table-legend span { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }.pricing-table-wrap { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; overflow-y: hidden; border: 1px solid var(--line); border-radius: 18px; background: white; -webkit-overflow-scrolling: touch; }.pricing-table { width: 100%; min-width: 780px; border-collapse: collapse; }.pricing-table th, .pricing-table td { padding: 16px 18px; border-bottom: 1px solid var(--line); text-align: center; }.pricing-table th:first-child, .pricing-table td:first-child { text-align: left; }.pricing-table thead th { color: var(--ink); background: #faf9fc; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; }.pricing-table tbody th { color: #4c495a; font-size: 13px; font-weight: 800; line-height: 1.35; }.pricing-table tbody tr:last-child th, .pricing-table tbody tr:last-child td { border-bottom: 0; }.pricing-table-group th { padding: 15px 18px 12px; border-top: 1px solid #ded7ff; border-bottom: 1px solid #ded7ff; color: var(--purple); background: linear-gradient(90deg, #f3f0ff, #fbfaff); font-size: 11px; font-weight: 950; text-transform: uppercase; letter-spacing: .8px; }.pricing-table-group:first-child th { border-top: 0; }.pricing-table-group span { display: inline-flex; align-items: center; gap: 8px; }.pricing-table-group span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--purple); box-shadow: 0 0 0 5px var(--purple-soft); }.availability-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; vertical-align: middle; }.availability-dot.is-available { background: var(--green); box-shadow: 0 0 0 4px var(--green-soft); }.availability-dot.is-unavailable { background: #b9b5c4; box-shadow: 0 0 0 4px #f0eef4; }

.formation-hero { min-height: 245px; display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 24px; align-items: center; padding: 36px; margin-bottom: 22px; overflow: hidden; border: 1px solid #d9d2ff; border-radius: 28px; color: white; background: radial-gradient(circle at 88% 12%, rgba(255,255,255,.22), transparent 31%), linear-gradient(135deg, #171626, #6f52ed); box-shadow: 0 22px 55px rgba(43,35,105,.18); }.formation-hero h1 { max-width: 720px; margin: 8px 0 12px; font: 900 clamp(33px, 5vw, 56px)/1.02 var(--font-display); letter-spacing: -2.2px; }.formation-hero p { max-width: 700px; margin: 0; color: #e5e0ff; }.formation-hero-card { padding: 22px; border: 1px solid rgba(255,255,255,.18); border-radius: 20px; background: rgba(255,255,255,.1); backdrop-filter: blur(12px); }.formation-hero-card .title-icon { margin-bottom: 16px; background: white; }.formation-hero-card strong { display: block; margin-bottom: 6px; color: white; font-size: 18px; }.formation-hero-card p { color: #eeeaff; font-size: 14px; }
.formation-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.formation-layout { display: grid; grid-template-columns: minmax(0, 1fr) 315px; gap: 20px; align-items: start; }.formation-catalog { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }.training-card { min-width: 0; display: flex; flex-direction: column; min-height: 100%; padding: 24px; border: 1px solid var(--line); border-radius: 22px; background: white; box-shadow: var(--shadow); }.training-card-featured { border-color: #cfc4ff; background: linear-gradient(135deg, #fff, #fbfaff); }.training-card-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 14px; }.training-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; margin-bottom: 18px; border: 1px solid #ebe7f6; border-radius: 16px; background: #f7f4ff; }.training-card-featured .training-image { border-color: #d9d0ff; box-shadow: 0 14px 30px rgba(111,82,237,.09); }.training-number { color: #c6c1d2; font: 900 12px var(--font-display); letter-spacing: 1.3px; }.training-level { padding: 6px 10px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .4px; }.training-card h2 { margin: 0 0 9px; font: 850 22px/1.17 var(--font-display); letter-spacing: -.7px; }.training-card p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }.training-meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 13px; }.training-meta span { padding: 6px 9px; border-radius: 8px; color: #5f5b6c; background: #f4f3f7; font-size: 11px; font-weight: 800; }.training-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 20px; }.training-tags span { padding: 6px 9px; border-radius: 999px; color: #625a83; background: var(--purple-soft); font-size: 10px; font-weight: 800; }.training-card .button { margin-top: auto; }.training-card .button:disabled { color: #8f8a9c; cursor: not-allowed; transform: none; box-shadow: none; }
.formation-sidebar { position: sticky; top: 96px; padding: 25px; }.formation-sidebar h2 { margin: 6px 0 18px; font: 850 22px var(--font-display); letter-spacing: -.6px; }.learning-path { display: grid; gap: 13px; padding: 0; margin: 0 0 18px; list-style: none; }.learning-path li { display: flex; gap: 11px; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; }.learning-path li > span { width: 30px; height: 30px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--purple); background: var(--purple-soft); font-size: 10px; font-weight: 900; }.learning-path strong { display: block; font-size: 13px; }.learning-path p { margin: 3px 0 0; color: var(--muted); font-size: 11px; line-height: 1.45; }

.training-card-progress { display: grid; gap: 8px; margin: 18px 0 16px; padding: 13px; border: 1px solid #ece9f5; border-radius: 14px; background: #faf9ff; }.training-card-progress-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #5d596d; font-size: 14px; font-weight: 800; }.training-card-progress-head strong { color: var(--purple); font-size: 13px; text-transform: uppercase; letter-spacing: .5px; }.training-card-progress small { color: var(--muted); font-size: 12px; font-weight: 700; }.training-player { margin-top: 24px; padding: 28px; scroll-margin-top: 90px; }.training-player-head { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(170px, .25fr); gap: 22px; align-items: start; padding-bottom: 20px; border-bottom: 1px solid var(--line); }.training-player-head h2 { margin: 5px 0 7px; font: 850 28px var(--font-display); letter-spacing: -1px; }.training-player-head p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }.training-player-score { display: grid; gap: 5px; justify-items: end; padding: 14px; border-radius: 16px; color: var(--purple); background: var(--purple-soft); text-align: right; }.training-player-score strong { font: 900 20px var(--font-display); }.training-player-score span { color: #6f6492; font-size: 13px; font-weight: 800; }.training-player-progress { display: grid; grid-template-columns: minmax(190px, .28fr) minmax(0, 1fr); gap: 18px; align-items: center; margin: 22px 0; }.training-player-progress strong { display: block; color: var(--purple); font-size: 13px; text-transform: uppercase; letter-spacing: .6px; }.training-player-progress span { color: var(--muted); font-size: 14px; }.training-chapter { display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.1fr); gap: 24px; align-items: stretch; margin-bottom: 22px; }.training-chapter.is-reversed { grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr); }.training-chapter.is-reversed .training-chapter-media { order: 2; }.training-chapter-media { position: relative; min-height: 300px; margin: 0; overflow: hidden; border-radius: 22px; background: linear-gradient(135deg, #221f37, #7056ec); box-shadow: 0 20px 48px rgba(44,35,105,.12); }.training-chapter-media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 20% 10%, rgba(255,255,255,.24), transparent 28%), linear-gradient(180deg, transparent 42%, rgba(18,16,30,.55)); pointer-events: none; }.training-chapter-media img { width: 100%; height: 100%; min-height: 300px; object-fit: cover; display: block; }.training-chapter-media figcaption { position: absolute; left: 18px; bottom: 18px; z-index: 1; padding: 8px 11px; border-radius: 999px; color: white; background: rgba(24,22,38,.7); font-size: 12px; font-weight: 900; backdrop-filter: blur(8px); }.training-chapter-copy { padding: 26px; border: 1px solid var(--line); border-radius: 22px; background: white; }.training-chapter-copy h3 { margin: 6px 0 12px; font: 850 26px/1.15 var(--font-display); letter-spacing: -.8px; }.training-chapter-copy p { color: #595668; font-size: 14px; line-height: 1.7; }.training-chapter-summary { margin-top: 0; color: #3f3b50 !important; font-weight: 750; }.training-keypoints { display: grid; gap: 9px; padding: 0; margin: 18px 0 0; list-style: none; }.training-keypoints li { position: relative; padding: 11px 12px 11px 35px; border-radius: 12px; color: #565266; background: #faf9fc; font-size: 14px; line-height: 1.45; }.training-keypoints li::before { content: ""; position: absolute; left: 14px; top: 17px; width: 8px; height: 8px; border-radius: 50%; background: var(--purple); box-shadow: 0 0 0 5px var(--purple-soft); }.training-quiz { padding: 24px; border: 1px solid #d9d2ff; border-radius: 22px; background: linear-gradient(145deg, #fff, #fbfaff); }.training-quiz-head h3 { margin: 6px 0 18px; font: 800 21px/1.35 var(--font-display); }.training-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }.training-option { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 74px; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: white; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }.training-option:hover { border-color: #cfc6fa; box-shadow: 0 12px 25px rgba(111,82,237,.08); transform: translateY(-1px); }.training-option input { position: absolute; opacity: 0; pointer-events: none; }.training-option > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; color: var(--purple); background: var(--purple-soft); font-size: 14px; font-weight: 900; }.training-option strong { color: #4e4a5f; font-size: 14px; line-height: 1.45; }.training-option:has(input:checked) { border-color: var(--purple); box-shadow: 0 0 0 2px var(--purple-soft); }.training-option.is-correct { border-color: #9ed9bf; background: var(--green-soft); }.training-option.is-correct > span { color: white; background: var(--green); }.training-option.is-wrong { border-color: #f2b6a6; background: #fff4ef; }.training-option.is-wrong > span { color: white; background: #dc735f; }.training-feedback { display: grid; gap: 4px; margin-top: 16px; padding: 14px 16px; border-radius: 14px; color: #615b75; background: var(--purple-soft); }.training-feedback strong { font-size: 15px; }.training-feedback p { margin: 0; font-size: 14px; line-height: 1.55; }.training-feedback.is-positive { color: #39785f; background: var(--green-soft); }.training-feedback.is-negative { color: #98603d; background: var(--orange-soft); }.training-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 18px; }.training-actions .button:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }.training-complete { text-align: center; }.training-complete h2 { margin: 8px 0 10px; font: 900 34px var(--font-display); letter-spacing: -1.2px; }.training-complete > p { max-width: 720px; margin: 0 auto; color: var(--muted); font-size: 15px; line-height: 1.65; }.training-final-score { --score: 0; position: relative; width: 150px; height: 150px; display: grid; place-items: center; margin: 28px auto; border-radius: 50%; background: conic-gradient(var(--purple) calc(var(--score) * 1%), #eceaf2 0); }.training-final-score::before { content: ""; position: absolute; inset: 13px; border-radius: 50%; background: white; }.training-final-score span { position: relative; z-index: 1; display: grid; color: var(--purple); }.training-final-score strong { font: 900 34px var(--font-display); }.training-final-score small { color: var(--muted); font-size: 13px; font-weight: 800; }.training-final-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-top: 24px; text-align: left; }.training-final-grid article { padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: #faf9fc; }.training-final-grid span { color: var(--purple); font: 900 13px var(--font-display); }.training-final-grid strong { display: block; margin: 8px 0 6px; font-size: 14px; }.training-final-grid p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.45; }

.learning-empty { max-width: 760px; margin: 30px auto 0; padding: 34px; text-align: center; }.learning-empty h1 { margin: 7px 0 10px; font: 900 34px var(--font-display); letter-spacing: -1.2px; }.learning-empty p { max-width: 560px; margin: 0 auto 22px; color: var(--muted); font-size: 15px; line-height: 1.65; }.learning-view { max-width: none; }.learning-view .training-player { --training-page-gutter: clamp(24px, 4vw, 54px); --training-sticky-top: 78px; --training-head-height: 72px; --training-progress-height: 48px; margin: 0 calc(-1 * var(--training-page-gutter)); padding: 28px var(--training-page-gutter); scroll-margin-top: 90px; border-right: 0; border-left: 0; border-radius: 0; }.learning-view .training-chapter, .learning-view .training-quiz, .learning-view .training-complete { max-width: 1440px; margin-right: auto; margin-left: auto; }.training-player-head { position: sticky; top: var(--training-sticky-top); z-index: 12; min-height: var(--training-head-height); max-height: var(--training-head-height); margin: -28px calc(-1 * var(--training-page-gutter)) 0; padding: 10px var(--training-page-gutter); align-items: center; overflow: hidden; border: 1px solid rgba(233,231,239,.92); border-right: 0; border-left: 0; border-radius: 0; background: rgba(255,255,255,.96); box-shadow: 0 14px 32px rgba(27,24,58,.08); backdrop-filter: blur(14px); }.training-back-button { min-height: 38px; padding: 0 14px; white-space: nowrap; }.training-player-head h1 { margin: 2px 0 3px; overflow: hidden; font: 850 23px/1.05 var(--font-display); letter-spacing: -.8px; text-overflow: ellipsis; white-space: nowrap; }.training-player-head p { display: none; overflow: hidden; font-size: 12px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }.training-player-score { gap: 2px; padding: 9px 11px; border-radius: 12px; }.training-player-score strong { font-size: 15px; line-height: 1.1; }.training-player-score span { font-size: 11px; line-height: 1.2; }.training-player-progress { position: sticky; top: calc(var(--training-sticky-top) + var(--training-head-height)); z-index: 11; min-height: var(--training-progress-height); max-height: var(--training-progress-height); margin: 0 calc(-1 * var(--training-page-gutter)) 22px; padding: 7px var(--training-page-gutter); border-bottom: 1px solid rgba(233,231,239,.92); background: rgba(255,255,255,.94); box-shadow: 0 12px 24px rgba(27,24,58,.06); backdrop-filter: blur(14px); }.training-player-progress strong { font-size: 11px; line-height: 1.1; }.training-player-progress span { display: block; overflow: hidden; font-size: 12px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }.training-complete h1 { margin: 8px 0 10px; font: 900 34px var(--font-display); letter-spacing: -1.2px; }.training-answer-state { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; padding: 0 14px; border-radius: 10px; color: var(--green); background: var(--green-soft); font-size: 14px; font-weight: 900; }
.tests-hero { min-height: 245px; display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; align-items: center; padding: 36px; margin-bottom: 22px; overflow: hidden; border: 1px solid #d9d2ff; border-radius: 28px; color: white; background: radial-gradient(circle at 92% 10%, rgba(255,255,255,.24), transparent 31%), linear-gradient(135deg, #171626, #2f9a73); box-shadow: 0 22px 55px rgba(43,35,105,.18); }
.tests-hero h1 { margin: 8px 0 12px; font: 900 clamp(36px, 5vw, 58px)/1 var(--font-display); letter-spacing: -2.2px; }
.tests-hero p { max-width: 720px; margin: 0; color: #e9fff5; font-size: 16px; line-height: 1.6; }
.tests-hero img { width: 100%; max-width: 330px; justify-self: end; filter: drop-shadow(0 22px 35px rgba(0,0,0,.18)); }
.tests-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.tests-layout { display: grid; grid-template-columns: minmax(0, 1fr) 315px; gap: 20px; align-items: start; }
.tests-catalog { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.test-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: white; box-shadow: var(--shadow); }
.test-card-purple { border-color: #d8d0ff; }
.test-card-green { border-color: #cdeee1; }
.test-card-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #f8f6ff; }
.test-card-body { padding: 22px; }
.test-card-top { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 14px; color: var(--muted); font-size: 13px; font-weight: 800; }
.test-badge { padding: 6px 10px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 12px; text-transform: uppercase; letter-spacing: .4px; }
.test-card h2 { margin: 0 0 9px; font: 850 24px/1.12 var(--font-display); letter-spacing: -.8px; }
.test-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.6; }
.test-card-meta { margin: 18px 0; padding: 12px 13px; border-radius: 12px; color: #5f5b6c; background: #f7f6f9; font-size: 13px; font-weight: 800; }
.tests-sidebar { position: sticky; top: 96px; padding: 25px; }
.tests-sidebar h2 { margin: 6px 0 18px; font: 850 22px var(--font-display); letter-spacing: -.6px; }
.test-session, .test-results { max-width: 980px; margin: 0 auto; padding: 28px; }
.test-session-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center; margin-bottom: 20px; }
.test-session-head h2 { margin: 4px 0 0; font: 850 26px var(--font-display); letter-spacing: -.8px; }
.test-session-count { min-width: 98px; padding: 12px 14px; border-radius: 16px; text-align: center; color: var(--purple); background: var(--purple-soft); }
.test-session-count strong { display: block; font: 900 25px var(--font-display); }
.test-session-count span { color: #6f6686; font-size: 12px; font-weight: 800; }
.test-progress-row { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 12px; align-items: center; margin-bottom: 22px; color: var(--muted); font-size: 13px; font-weight: 800; }
.test-question-card { padding: 25px; border: 1px solid var(--line); border-radius: 21px; background: #fbfafe; }
.test-question { max-width: 840px; margin: 0 0 22px; color: var(--ink); font: 750 24px/1.42 var(--font-display); letter-spacing: -.6px; }
.test-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.test-option { min-height: 78px; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; align-items: center; padding: 15px; border: 1px solid var(--line); border-radius: 15px; color: var(--ink); background: white; text-align: left; cursor: pointer; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.test-option:hover:not(:disabled), .test-option:focus-visible { border-color: #cabfff; transform: translateY(-1px); box-shadow: 0 12px 24px rgba(27,24,58,.08); }
.test-option span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 12px; color: var(--purple); background: var(--purple-soft); font-weight: 900; }
.test-option strong { font-size: 14px; line-height: 1.45; }
.test-option.is-selected { border-color: #bfb2ff; background: #fbfaff; }
.test-option.is-correct { border-color: #9cdbc0; background: #f1fbf6; }
.test-option.is-correct span { color: white; background: var(--green); }
.test-option.is-wrong { border-color: #ffc7be; background: #fff4f1; }
.test-option.is-wrong span { color: white; background: #df735f; }
.test-feedback { margin-top: 17px; padding: 15px 16px; border-radius: 14px; }
.test-feedback strong { display: block; margin-bottom: 5px; font-size: 14px; }
.test-feedback p { margin: 0; font-size: 14px; line-height: 1.55; }
.test-feedback.is-positive { color: #25684d; background: var(--green-soft); }
.test-feedback.is-negative { color: #9c4b3b; background: #fff0ec; }
.test-session-actions { display: flex; justify-content: space-between; gap: 16px; align-items: center; margin-top: 20px; }
.test-session-actions > span { max-width: 560px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.test-result-hero { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 24px; align-items: center; padding: 22px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(135deg, #fff, #fbfaff); }
.test-result-hero h2 { margin: 6px 0 8px; font: 900 30px var(--font-display); letter-spacing: -1px; }
.test-result-hero p { margin: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
.test-score-ring { --score: 0; position: relative; width: 128px; height: 128px; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--green) calc(var(--score) * 1%), #eceaf2 0); }
.test-score-ring::before { content: ""; position: absolute; width: 101px; height: 101px; border-radius: 50%; background: white; }
.test-score-ring span { position: relative; z-index: 1; display: grid; text-align: center; }
.test-score-ring strong { color: var(--green); font: 900 30px var(--font-display); }
.test-score-ring small { color: var(--muted); font-size: 13px; }
.test-personality-mark { width: 116px; height: 116px; display: grid; place-items: center; border-radius: 28px; color: white; background: linear-gradient(145deg, var(--purple), #8a74f4); font: 900 34px var(--font-display); box-shadow: 0 18px 36px rgba(111,82,237,.22); }
.test-review-list, .test-trait-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 18px; }
.test-review-list article, .test-trait-grid article { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 15px; background: white; }
.test-review-list article { grid-template-columns: 40px minmax(0, 1fr); align-items: start; }
.test-review-list article > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; font-weight: 900; }
.test-review-list article.is-correct > span { color: var(--green); background: var(--green-soft); }
.test-review-list article.is-wrong > span { color: #d56855; background: #fff0ec; }
.test-review-list strong, .test-trait-grid strong { font-size: 14px; }
.test-review-list p, .test-trait-grid p { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.test-trait-grid article > div:first-child { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.test-trait-grid span { color: var(--purple); font-size: 13px; font-weight: 900; }
.test-results-actions { display: flex; justify-content: flex-end; margin-top: 18px; }

.ats-badge { position: relative; display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid #bce6d5; border-radius: 12px; background: var(--green-soft); }.ats-badge > span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--green); }.ats-badge strong { display: block; font-size: 12px; }.ats-badge b { color: var(--green); }.ats-badge small { color: #6c8d80; font-size: 12px; }.ats-score-line { display: flex; align-items: center; gap: 7px; }.ats-help { position: relative; display: inline-flex; align-items: center; }.ats-help-button { width: 21px; height: 21px; display: inline-grid; place-items: center; border: 1px solid rgba(28, 158, 104, .3); border-radius: 50%; color: var(--green); background: white; font-size: 12px; font-weight: 900; line-height: 1; cursor: help; box-shadow: 0 6px 14px rgba(31, 41, 55, .08); }.ats-help-button:focus-visible { outline: 3px solid rgba(28, 158, 104, .22); outline-offset: 2px; }.ats-help-tooltip { position: absolute; right: 0; top: calc(100% + 10px); z-index: 40; width: min(300px, 72vw); padding: 12px 14px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: white; box-shadow: 0 18px 35px rgba(31, 41, 55, .14); font-size: 14px; font-weight: 650; line-height: 1.45; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .18s ease, transform .18s ease, visibility .18s ease; pointer-events: none; }.ats-help-tooltip::before { content: ""; position: absolute; top: -6px; right: 7px; width: 10px; height: 10px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); background: white; transform: rotate(45deg); }.ats-help:hover .ats-help-tooltip, .ats-help:focus-within .ats-help-tooltip { opacity: 1; visibility: visible; transform: translateY(0); }
.cv-mode-tabs { display: inline-flex; gap: 8px; padding: 7px; margin: 0 0 18px; border: 1px solid var(--line); border-radius: 14px; background: white; box-shadow: var(--shadow); }.cv-mode-tabs button { min-height: 38px; padding: 0 18px; border: 0; border-radius: 10px; color: var(--muted); background: transparent; font-weight: 800; cursor: pointer; }.cv-mode-tabs button.active { color: white; background: var(--purple); box-shadow: 0 10px 20px rgba(111,82,237,.18); }.cv-mode-panel { display: none; }.cv-mode-panel.active { display: block; }.cv-upload-panel { padding: 28px; }.cv-upload-hero { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 24px; align-items: stretch; }.cv-upload-hero h2 { margin: 6px 0 8px; font: 850 28px var(--font-display); letter-spacing: -1px; }.cv-upload-hero p { max-width: 660px; margin: 0; color: var(--muted); line-height: 1.6; }.cv-upload-drop { min-height: 190px; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; padding: 24px; border: 1px dashed #c9c2e8; border-radius: 18px; background: linear-gradient(145deg, #fff, #faf8ff); text-align: center; cursor: pointer; }.cv-upload-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }.cv-upload-drop strong { font-size: 16px; }.cv-upload-drop small { color: var(--muted); font-size: 12px; }.cv-source-actions { display: flex; align-items: center; gap: 14px; margin-top: 20px; }.cv-source-actions span { color: var(--muted); font-size: 13px; }.cv-analysis-feedback { padding-top: 24px; margin-top: 24px; border-top: 1px solid var(--line); }.cv-analysis-feedback h3 { margin: 4px 0 0; font: 800 20px var(--font-display); }.cv-feedback-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 16px; }.cv-feedback-grid article { padding: 17px; border: 1px solid var(--line); border-radius: 14px; background: #faf9fc; }.cv-feedback-grid strong { display: block; margin-bottom: 6px; font-size: 14px; }.cv-feedback-grid p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }.cv-sync-banner { display: flex; justify-content: space-between; gap: 18px; align-items: center; padding: 18px 20px; margin-bottom: 18px; border: 1px solid #d9d2ff; border-radius: 18px; background: linear-gradient(120deg, #fff, #faf8ff); box-shadow: var(--shadow); }.cv-sync-banner strong { display: block; margin: 3px 0 5px; font: 800 17px var(--font-display); }.cv-sync-banner p { margin: 0; color: var(--muted); font-size: 12px; }.cv-layout { display: grid; grid-template-columns: minmax(430px, .9fr) minmax(430px, 1.1fr); gap: 20px; align-items: start; }.cv-editor { overflow: hidden; }.cv-tabs { display: flex; border-bottom: 1px solid var(--line); padding: 0 22px; }.cv-tabs button { flex: 1; padding: 17px 5px 13px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--muted); font-size: 9px; font-weight: 700; cursor: pointer; }.cv-tabs button.active { color: var(--purple); border-color: var(--purple); }
.cv-tab-panel { display: none; min-height: 360px; padding: 25px; }.cv-tab-panel.active { display: block; }.cv-tab-panel h2 { margin: 0 0 4px; font: 700 16px "Manrope"; }.cv-tab-panel > p { margin: 0 0 21px; color: var(--muted); font-size: 10px; }.ats-tip { display: flex; gap: 10px; padding: 13px; margin-top: 13px; background: var(--purple-soft); border-radius: 10px; color: var(--purple); }.ats-tip p { margin: 0; color: #665b8d; font-size: 9px; }.ats-tip strong { display: block; color: #504575; }.keyword-match { margin-top: 25px; }.keyword-match > div:first-child { display: flex; justify-content: space-between; margin-bottom: 8px; font-size: 10px; }.keyword-match strong { color: var(--purple); }
.cv-experience-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }.cv-experience-toolbar p { margin: 0; color: var(--muted); font-size: 10px; }.cv-add-experience { flex: 0 0 auto; min-height: 38px; padding: 8px 13px; font-size: 11px; }.cv-experiences-editor { display: grid; gap: 14px; }.cv-experience-card { position: relative; min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; }.cv-experience-card legend { padding: 0 7px; color: var(--purple); font-size: 10px; font-weight: 800; }.cv-experience-active { width: fit-content; display: inline-flex; grid-template-columns: auto; align-items: center; gap: 8px; margin: 4px 0 13px; color: var(--purple); font-size: 11px; font-weight: 800; }.cv-experience-active input { width: 16px; height: 16px; accent-color: var(--purple); }.cv-remove-experience { position: absolute; top: 10px; right: 12px; min-height: 32px; padding: 5px 8px; border: 0; border-radius: 7px; color: #a15353; background: #fff0f0; font-size: 9px; font-weight: 700; cursor: pointer; }.cv-remove-experience:hover { background: #ffe2e2; }
.editor-footer { display: flex; align-items: center; justify-content: space-between; padding: 15px 22px; border-top: 1px solid var(--line); }.editor-footer > span { color: var(--green); font-size: 9px; }
.cv-preview-wrap { position: sticky; top: 98px; padding: 15px; background: #e9e8ed; border-radius: 18px; }.preview-toolbar { display: flex; justify-content: space-between; align-items: center; padding: 0 5px 12px; color: #777481; font-size: 9px; }.preview-toolbar div { display: flex; align-items: center; gap: 8px; }.preview-toolbar button { width: 21px; height: 21px; border: 0; border-radius: 5px; background: white; }
.cv-paper { width: min(100%, 595px); min-height: 750px; padding: 43px 45px; margin: 0 auto; background: white; box-shadow: 0 5px 22px rgba(29,27,45,.12); color: #252331; }.cv-paper header { padding-bottom: 19px; border-bottom: 2px solid #282638; }.cv-paper header h2 { margin: 0; font: 800 27px "Manrope"; letter-spacing: -1px; text-transform: uppercase; }.cv-paper header > p { margin: 4px 0 12px; color: var(--purple); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }.cv-paper header div { display: flex; flex-wrap: wrap; gap: 12px; font-size: 7px; color: #66636f; }.cv-paper section { margin-top: 22px; }.cv-paper section h3 { padding-bottom: 6px; margin: 0 0 10px; border-bottom: 1px solid #d8d6dd; font-size: 9px; letter-spacing: 1.3px; }.cv-paper section p { margin: 0; color: #55525e; font-size: 8px; line-height: 1.65; }.cv-preview-experience + .cv-preview-experience { margin-top: 15px; }.cv-exp-head { display: flex; justify-content: space-between; gap: 15px; font-size: 9px; }.cv-exp-head span { flex: 0 0 auto; }.cv-paper em { display: block; margin-top: 3px; color: var(--purple); font-size: 8px; font-style: normal; }.cv-paper ul { padding-left: 14px; margin: 7px 0 0; color: #55525e; font-size: 8px; line-height: 1.6; }.cv-skill-list { display: flex; flex-wrap: wrap; gap: 5px; }.cv-skill-list span { padding: 5px 7px; background: #f1eff8; font-size: 7px; }

.modal-backdrop { position: fixed; inset: 0; z-index: 50; display: none; place-items: center; padding: 25px; background: rgba(14,13,25,.64); backdrop-filter: blur(5px); }.modal-backdrop.open { display: grid; animation: fade .2s; } @keyframes fade { from { opacity: 0; } }
.modal { position: relative; width: min(1100px, 95vw); max-height: 92vh; overflow: auto; border-radius: 21px; background: var(--background); box-shadow: 0 30px 90px rgba(0,0,0,.22); }.modal-header { position: relative; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 20px; padding: 26px 32px; background: white; border-bottom: 1px solid var(--line); }.modal-close { position: absolute; right: 14px; top: 12px; z-index: 2; font-size: 22px; }.modal-job-brand { display: flex; align-items: center; gap: 15px; }.modal-job-brand h2 { margin: 6px 0 3px; font: 700 21px "Manrope"; }.modal-job-brand p { margin: 0; color: var(--muted); font-size: 10px; }.modal-score { display: flex; align-items: center; gap: 10px; margin-right: 30px; }.modal-score > span { color: var(--muted); font-size: 9px; }.modal-score strong { color: var(--purple); font: 800 29px "Manrope"; }.modal-score small { font-size: 10px; color: var(--muted); }
.modal-tabs { position: sticky; top: 0; z-index: 4; display: flex; padding: 0 32px; background: white; border-bottom: 1px solid var(--line); }.modal-tabs button { padding: 15px 18px 13px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; font-size: 10px; font-weight: 700; cursor: pointer; }.modal-tabs button.active { color: var(--purple); border-color: var(--purple); }.modal-tabs button span { padding: 2px 5px; margin-left: 4px; border-radius: 10px; background: var(--purple-soft); font-size: 8px; }
.modal-body { padding: 25px 32px 32px; }.detail-panel { display: none; }.detail-panel.active { display: block; }.detail-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(250px, .7fr); gap: 20px; }.detail-block, .detail-side-card { padding: 22px; margin-bottom: 15px; background: white; border: 1px solid var(--line); border-radius: 15px; }.detail-block h3, .detail-side-card h3 { margin: 0 0 10px; font: 700 14px "Manrope"; }.detail-block p, .detail-side-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.65; }.lead-block { border-left: 4px solid var(--purple); }.lead-block p { margin-top: 9px; color: #3c394b; font-size: 12px; font-weight: 600; }.check-list { list-style: none; display: grid; gap: 8px; padding: 0; margin: 14px 0 0; }.check-list li { position: relative; padding-left: 20px; color: #5f5c6b; font-size: 10px; }.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 800; }.mission-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.mission-grid span { padding: 10px; border-radius: 8px; color: #625a83; background: var(--purple-soft); font-size: 9px; font-weight: 600; text-align: center; }
.verdict-card { background: var(--purple-soft); border: 0; }.verdict-score { margin: 10px 0; color: var(--purple); font: 800 19px "Manrope"; }.marker-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }.marker-list span { color: var(--muted); font-size: 8px; }.marker-list b { display: block; color: var(--ink); font-size: 11px; }.caution { background: #fff8eb; border-color: #f8e8ca; }.caution ul { padding-left: 16px; margin: 9px 0 0; color: #806f50; font-size: 9px; line-height: 1.8; }
.analysis-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.analysis-columns .detail-block { margin: 0; }.full-width { grid-column: 1 / -1; }.rich-list { list-style: none; padding: 0; margin: 13px 0 0; display: grid; gap: 12px; }.rich-list li { display: flex; gap: 10px; }.rich-list li > span { color: var(--purple); font-size: 9px; font-weight: 800; }.rich-list strong { font-size: 10px; }.risk-block { background: #fff9ee; }.match-skills { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 25px; margin-top: 17px; }
.company-detail-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 15px; }.company-detail-layout .detail-block { margin: 0; }.company-identity-card { display: grid; gap: 18px; }.company-identity-head { display: flex; align-items: center; gap: 14px; }.company-avatar { width: 54px; height: 54px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 16px; color: white; background: linear-gradient(145deg, #826bf1, #5535d7); font: 900 17px var(--font-display); }.company-identity-head h3 { margin: 0 0 5px; font: 850 22px var(--font-display); letter-spacing: -.6px; }.company-identity-head p { margin: 0; color: var(--muted); font-size: 12px; }.company-actions { display: flex; flex-wrap: wrap; gap: 10px; }.company-actions .button { min-height: 38px; text-decoration: none; }.disabled-link { pointer-events: none; }.company-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; }.company-facts div { padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: #faf9fc; }.company-facts dt { margin-bottom: 5px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; }.company-facts dd { margin: 0; color: var(--ink); font-size: 12px; font-weight: 800; }.company-block-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 12px; }.company-map-card { min-height: 100%; }.company-map { min-height: 265px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: #f2f0f7; }.company-map .leaflet-control-container { font-size: 10px; }.company-map-placeholder { height: 265px; display: grid; place-items: center; color: var(--muted); font-size: 12px; font-weight: 800; }.company-map-fallback { margin: 10px 0 0 !important; padding: 10px 12px; border-radius: 10px; color: #6d638d !important; background: var(--purple-soft); font-weight: 700; }.company-sites-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin-top: 12px; }.company-sites-list article { padding: 11px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }.company-sites-list strong { display: block; margin-bottom: 3px; font-size: 12px; }.company-sites-list span { color: var(--muted); font-size: 10px; }.company-list { display: grid; gap: 9px; padding: 0; margin: 12px 0 0; list-style: none; }.company-list li { padding: 10px 12px; border-radius: 10px; color: #5a5668; background: #faf9fc; font-size: 12px; font-weight: 700; }.muted-list-item { color: var(--muted) !important; font-weight: 600 !important; }.company-competitors { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }.company-competitors span { padding: 8px 11px; border-radius: 999px; color: #625a83; background: var(--purple-soft); font-size: 11px; font-weight: 800; }.company-competitors .muted-chip { color: var(--muted); background: #f3f1f8; }
.questions-head { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 17px; }.questions-head h3 { margin: 4px 0; font: 700 19px "Manrope"; }.questions-head p { color: var(--muted); margin: 0; font-size: 10px; }.questions-head > strong { color: var(--purple); }
.question-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.question-item { display: flex; align-items: flex-start; gap: 11px; padding: 14px; border: 1px solid var(--line); border-radius: 11px; background: white; cursor: pointer; }.question-item input { flex: 0 0 17px; width: 17px; height: 17px; accent-color: var(--purple); }.question-item span { color: #53505e; font-size: 10px; line-height: 1.5; }.question-item:has(input:checked) { border-color: #cfc5fa; background: #fbfaff; }
.trap-question-list { display: grid; gap: 12px; }
.trap-question-card { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; padding: 16px; border: 1px solid #e3dffa; border-radius: 15px; background: linear-gradient(135deg, #fff 58%, #fbf9ff); box-shadow: 0 10px 24px rgba(36,32,65,.035); }
.trap-question-index { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: var(--purple); background: var(--purple-soft); font: 900 13px var(--font-display); }
.trap-question-card header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.trap-question-category { display: inline-flex; width: fit-content; padding: 5px 8px; border-radius: 999px; color: #5d45d8; background: var(--purple-soft); font-size: 12px; font-weight: 900; letter-spacing: .02em; }
.trap-question-card h4 { margin: 0 0 12px; color: var(--ink); font: 850 18px/1.35 var(--font-display); letter-spacing: -.35px; }
.trap-question-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.trap-question-meta div { padding: 12px; border: 1px solid #ece9f5; border-radius: 12px; background: white; }
.trap-question-meta strong { display: block; margin-bottom: 5px; color: var(--ink); font-size: 13px; }
.trap-question-meta p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.interview-intro { max-width: 620px; padding: 35px 0; margin: 0 auto; text-align: center; }.interview-orb { width: 65px; height: 65px; display: grid; place-items: center; margin: 0 auto 17px; border-radius: 22px; color: white; background: linear-gradient(145deg, #826bf1, #5535d7); font-size: 25px; box-shadow: 0 15px 30px rgba(111,82,237,.25); }.interview-intro h3 { margin: 7px 0 10px; font: 800 25px "Manrope"; }.interview-intro > p { color: var(--muted); font-size: 11px; line-height: 1.6; }.interview-features { display: flex; justify-content: center; gap: 35px; margin: 25px 0; }.interview-features span { display: flex; flex-direction: column; color: var(--muted); font-size: 9px; }.interview-features b { color: var(--ink); font: 800 18px "Manrope"; }
.interview-session { display: none; max-width: 750px; margin: 0 auto; padding: 15px 0; }.interview-session.active { display: block; }.interview-progress { display: grid; grid-template-columns: 110px 1fr; align-items: center; gap: 15px; margin-bottom: 28px; }.interview-progress span { color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: .5px; }.question-category { color: var(--purple); font-size: 9px; font-weight: 800; letter-spacing: 1px; }.interview-session h3 { margin: 8px 0 20px; font: 700 20px/1.45 "Manrope"; }.interview-actions { display: flex; justify-content: space-between; margin-top: 12px; }.answer-hint { display: none; padding: 14px; margin-top: 12px; background: #fff9e9; border-radius: 10px; color: #71684f; font-size: 10px; line-height: 1.5; }.answer-hint.open { display: block; }
.interview-complete { max-width: 650px; padding: 45px 24px; margin: 0 auto; text-align: center; }
.interview-complete-icon { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto 18px; border-radius: 20px; color: white; background: linear-gradient(145deg, var(--green), #318b6a); box-shadow: 0 14px 30px rgba(68,169,130,.22); }
.interview-complete-icon .icon { width: 29px; height: 29px; }
.interview-complete h3 { margin: 7px 0 9px; font-size: 25px; }
.interview-complete > p { max-width: 540px; margin: 0 auto; color: var(--muted); font-size: 14px; line-height: 1.6; }
.interview-complete > p strong { color: var(--purple); }
.interview-complete-actions { display: flex; justify-content: center; gap: 10px; margin-top: 25px; }
.small-modal { width: min(510px, 92vw); padding: 35px; background: white; }.small-modal .modal-close { top: 10px; right: 10px; }.modal-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 13px; color: var(--purple); background: var(--purple-soft); font-size: 23px; }.small-modal h2 { margin: 16px 0 5px; font: 700 21px "Manrope"; }.small-modal > p { margin: 0 0 20px; color: var(--muted); font-size: 11px; }.small-modal .button { margin-top: 14px; }
.small-modal.add-job-modal { width: min(760px, 94vw); }
.small-modal.status-modal { width: min(620px, 94vw); padding: 32px; }
.status-modal-head { display: flex; gap: 15px; padding-right: 28px; margin-bottom: 18px; }
.status-modal-head .modal-icon { flex: 0 0 48px; }
.status-modal-head h2 { margin: 4px 0 6px; }
.status-modal-head p:last-child { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.status-modal-preview { min-height: 35px; display: flex; align-items: center; gap: 8px; margin: 0 0 13px; padding: 10px 12px; border-radius: 12px; color: #625f70; background: #faf9fc; font-size: 13px; font-weight: 700; }
.status-modal-preview .tag { margin-left: auto; }
.status-choice-list { display: grid; gap: 10px; }
.status-choice { display: grid; grid-template-columns: 40px minmax(0, 1fr) 22px; align-items: center; gap: 12px; min-height: 74px; padding: 13px 14px; border: 1px solid var(--line); border-radius: 14px; color: var(--ink); background: white; text-align: left; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease, background .18s ease; }
.status-choice:hover, .status-choice:focus-visible { border-color: #cfc7f7; box-shadow: 0 12px 26px rgba(73,55,150,.08); outline: none; transform: translateY(-1px); }
.status-choice.active { border-color: #cfc5fa; background: #fbfaff; box-shadow: 0 12px 26px rgba(111,82,237,.08); }
.status-choice-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; }
.status-choice-icon i { width: 10px; height: 10px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(255,255,255,.68); }
.status-choice strong { display: block; font-size: 15px; line-height: 1.25; }
.status-choice small { display: block; margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.status-choice > .icon { width: 20px; height: 20px; color: var(--purple); opacity: 0; transform: scale(.75); transition: opacity .18s ease, transform .18s ease; }
.status-choice.active > .icon { opacity: 1; transform: scale(1); }
.status-modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.status-modal-actions .button { margin-top: 0; }
#confirmStatusChange:disabled { opacity: .52; cursor: not-allowed; box-shadow: none; transform: none; }
.add-job-step { margin-top: 18px; }
.add-job-step[data-add-job-step="choice"] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.add-job-choice { min-height: 178px; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 16px; color: var(--ink); background: linear-gradient(145deg, #fff, #faf9ff); text-align: left; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.add-job-choice:hover { border-color: #cfc7f7; box-shadow: 0 14px 28px rgba(73,55,150,.09); transform: translateY(-2px); }
.add-job-choice strong { font-size: 15px; line-height: 1.25; }
.add-job-choice small { color: var(--muted); font-size: 12px; line-height: 1.45; }
.add-job-choice.is-upgrade { border-color: #d8d0ff; background: linear-gradient(145deg, #fff, #f5f1ff); box-shadow: inset 0 0 0 1px rgba(111,82,237,.08); }
.add-job-choice.is-upgrade:hover,
.add-job-choice.is-upgrade:focus-visible { border-color: #bbaaff; box-shadow: 0 16px 34px rgba(111,82,237,.16); }
.add-job-choice.is-upgrade .title-icon { color: white; background: var(--ink); }
.add-job-choice.is-upgrade small { color: #565068; }
.add-job-choice-plan { margin-top: -4px; }
.add-job-choice-cta { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; margin-top: auto; padding: 0 13px; border-radius: 999px; color: white; background: var(--ink); font-size: 12px; font-weight: 900; box-shadow: 0 10px 22px rgba(21,19,37,.16); }
.add-job-form-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 13px; }
.add-job-form-head .text-button .icon { transform: rotate(180deg); }
.add-job-form-head > span { padding: 6px 10px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .4px; }
.add-job-options { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(230px, .8fr); gap: 18px; }
.add-job-section { padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #faf9fc; }
.add-job-section h3 { margin: 0 0 14px; font: 800 15px var(--font-display); }
.add-job-upgrade { display: grid; gap: 12px; margin-top: 16px; padding: 16px; border: 1px solid #d8d0ff; border-radius: 16px; background: linear-gradient(145deg, #fff, #f7f4ff); }
.add-job-upgrade h4 { margin: 0; font: 850 18px/1.15 var(--font-display); letter-spacing: -.4px; }
.add-job-upgrade p { margin: 0; color: #5f5874; font-size: 13px; line-height: 1.55; }
.add-job-upgrade ul { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }
.add-job-upgrade li { position: relative; padding-left: 22px; color: #4c495a; font-size: 13px; line-height: 1.45; }
.add-job-upgrade li::before { content: ""; position: absolute; left: 0; top: .35em; width: 10px; height: 10px; border-radius: 50%; background: var(--purple); box-shadow: 0 0 0 4px var(--purple-soft); }
.analysis-loading { margin: 12px 0 0; padding: 11px 13px; border-radius: 11px; color: #5c5088; background: var(--purple-soft); font-size: 13px; font-weight: 700; }
.analysis-result { max-height: 180px; margin: 12px 0 0; padding: 13px; overflow: auto; border: 1px solid var(--line); border-radius: 11px; color: #514f5e; background: white; font: 400 12px/1.45 Consolas, "Courier New", monospace; white-space: pre-wrap; }
.add-job-analysis-wait { padding: 26px 8px 8px; text-align: center; }
.analysis-orb { width: 58px; height: 58px; display: inline-grid; place-items: center; margin-bottom: 14px; border-radius: 18px; color: var(--purple); background: var(--purple-soft); animation: analysis-float 1.8s ease-in-out infinite; }
.analysis-orb .icon { width: 25px; height: 25px; }
.analysis-complete-check { width: 62px; height: 62px; display: none; place-items: center; margin: 0 auto 14px; border-radius: 20px; color: white; background: linear-gradient(145deg, var(--green), #2f9a73); box-shadow: 0 18px 36px rgba(68, 169, 130, .24); }
.analysis-complete-check .icon { width: 28px; height: 28px; }
.add-job-analysis-wait.is-complete .analysis-orb,
.add-job-analysis-wait.is-complete .analysis-progress-line { display: none; }
.add-job-analysis-wait.is-complete .analysis-complete-check { display: inline-grid; }
.add-job-analysis-wait h3 { margin: 0 0 8px; font: 800 21px var(--font-display); }
.add-job-analysis-wait p { max-width: 520px; margin: 0 auto; color: var(--muted); font-size: 14px; }
.analysis-progress-line { position: relative; height: 8px; margin: 24px auto 12px; overflow: hidden; border-radius: 999px; background: #ece9f5; }
.analysis-progress-line span { position: absolute; inset: 0 auto 0 0; width: 42%; border-radius: inherit; background: linear-gradient(90deg, var(--purple), #a38fff); animation: analysis-slide 1.4s ease-in-out infinite; }
.add-job-analysis-wait small { color: #817d91; font-size: 12px; font-weight: 700; }
@keyframes analysis-slide {
  0% { transform: translateX(-110%); }
  100% { transform: translateX(240%); }
}
@keyframes analysis-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}
.modal-job-actions { display: flex; align-items: center; gap: 9px; margin-left: auto; padding-right: 34px; }
.modal-job-actions .button { min-height: 38px; padding: 0 13px; font-size: 11px; white-space: nowrap; }
.modal-job-actions .icon { width: 15px; height: 15px; }
.modal-delete-job { border: 1px solid #ffd1d1; }
.modal-close-job { border: 1px solid var(--line); }
.modal-status-row { display: inline-flex; align-items: center; gap: 6px; }
.status-edit-button { width: 29px; height: 29px; display: inline-grid; place-items: center; border: 0; border-radius: 9px; color: var(--purple); background: var(--purple-soft); cursor: pointer; transition: background .18s ease, transform .18s ease; }
.status-edit-button:hover { background: #e4ddff; transform: translateY(-1px); }
.status-edit-button:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.status-edit-button .icon { width: 14px; height: 14px; }
.toast { position: fixed; z-index: 100; right: 25px; bottom: 25px; display: flex; align-items: center; gap: 10px; padding: 12px 17px; border-radius: 11px; color: white; background: #252238; box-shadow: 0 15px 30px rgba(0,0,0,.2); transform: translateY(100px); opacity: 0; transition: .3s; }.toast.show { transform: none; opacity: 1; }.toast span { color: #77d6af; }.toast p { margin: 0; font-size: 10px; }.toast-action { display: inline-flex; align-items: center; min-height: 30px; padding: 0 10px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; color: white; background: rgba(255,255,255,.1); font-size: 12px; font-weight: 850; text-decoration: none; white-space: nowrap; }.toast-action:hover, .toast-action:focus-visible { background: rgba(255,255,255,.18); outline: none; }

[hidden] { display: none !important; }
.simulator-job-context { min-width: 225px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 12px; background: white; box-shadow: var(--shadow); }
.simulator-job-context span { display: block; margin-bottom: 4px; color: var(--muted); font-size: 8px; font-weight: 800; letter-spacing: 1px; }
.simulator-job-context strong { font-size: 11px; }
.simulator-intro { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px; background: linear-gradient(120deg, #fff, #faf8ff); }
.simulator-intro h2, .simulator-guide h2 { margin: 5px 0 7px; font: 700 20px var(--font-display); }
.simulator-intro p, .simulator-guide p { max-width: 670px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.simulator-intro-meta { display: flex; gap: 28px; flex: 0 0 auto; }
.simulator-intro-meta span { display: flex; flex-direction: column; color: var(--muted); font-size: 9px; text-align: center; }
.simulator-intro-meta strong { color: var(--ink); font: 800 22px var(--font-display); }
.interviewer-profiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 18px 0; }
.interviewer-profile-card { position: relative; padding: 23px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: white; box-shadow: var(--shadow); transition: transform .2s, border-color .2s; }
.interviewer-profile-card:hover { transform: translateY(-3px); border-color: #cfc6fa; }
.interviewer-profile-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--purple); }
.interviewer-profile-card.profile-orange::before { background: var(--orange); }
.interviewer-profile-card.profile-green::before { background: var(--green); }
.interviewer-profile-image { display: block; width: 100%; height: 142px; object-fit: cover; margin-bottom: 16px; border-radius: 15px; background: #f7f4ff; box-shadow: inset 0 0 0 1px rgba(27,24,58,.06); }
.profile-orange .interviewer-profile-image { background: var(--orange-soft); }
.profile-green .interviewer-profile-image { background: var(--green-soft); }
.profile-card-top { display: flex; align-items: center; justify-content: space-between; }
.interviewer-type-icon { width: 47px; height: 47px; display: grid; place-items: center; border-radius: 14px; color: var(--purple); background: var(--purple-soft); font: 800 13px var(--font-display); }
.profile-orange .interviewer-type-icon { color: #c96f3d; background: var(--orange-soft); }
.profile-green .interviewer-type-icon { color: var(--green); background: var(--green-soft); }
.difficulty-pill { padding: 5px 8px; border-radius: 15px; color: var(--muted); background: #f4f3f7; font-size: 8px; font-weight: 700; }
.profile-number { display: block; margin-top: 19px; color: #c4c0ce; font: 800 10px var(--font-display); letter-spacing: 1px; }
.interviewer-profile-card h2 { margin: 6px 0 3px; font: 800 20px var(--font-display); }
.interviewer-profile-card > strong { color: #514d60; font-size: 10px; }
.interviewer-profile-card > p { min-height: 55px; margin: 12px 0 16px; color: var(--muted); font-size: 10px; line-height: 1.55; }
.profile-meta { display: flex; gap: 8px; margin-bottom: 17px; }
.profile-meta span { padding: 5px 8px; border-radius: 7px; color: #747181; background: #f5f4f7; font-size: 8px; font-weight: 700; }
.simulator-guide { display: grid; grid-template-columns: minmax(220px, .7fr) minmax(0, 1.3fr); align-items: center; gap: 20px; padding: 20px; }
.simulator-guide-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.guide-step { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 11px; border-radius: 10px; background: #f7f6f9; }
.guide-step > span { color: var(--purple); font-size: 8px; font-weight: 800; }
.guide-step div { min-width: 0; display: flex; flex-direction: column; }
.guide-step strong { font-size: 9px; }.guide-step small { overflow: hidden; color: var(--muted); font-size: 7px; white-space: nowrap; text-overflow: ellipsis; }
.simulator-session-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.simulator-quit { color: var(--muted); }
.simulator-session-progress { width: min(410px, 55%); display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 12px; }
.simulator-session-progress > span { color: var(--muted); font-size: 9px; font-weight: 700; }
.simulator-session-progress .progress-track span { width: 12.5%; }
.simulator-phases { display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: white; }
.simulator-phase { position: relative; display: flex; align-items: center; gap: 9px; padding: 13px 15px; border-right: 1px solid var(--line); opacity: .5; }
.simulator-phase:last-child { border-right: 0; }
.simulator-phase > span { width: 24px; height: 24px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #8f8b9b; background: #efedf3; font-size: 8px; font-weight: 800; }
.simulator-phase div { display: flex; flex-direction: column; }.simulator-phase strong { font-size: 9px; }.simulator-phase small { color: var(--muted); font-size: 7px; }
.simulator-phase.active { opacity: 1; background: #fbfaff; }.simulator-phase.active > span { color: white; background: var(--purple); box-shadow: 0 0 0 4px var(--purple-soft); }
.simulator-phase.complete { opacity: .8; }.simulator-phase.complete > span { color: white; background: var(--green); }
.simulator-session-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 18px; align-items: start; }
.simulator-dialogue { display: flex; flex-direction: column; min-height: 510px; padding: 0; overflow: hidden; }
.interviewer-presence { display: flex; align-items: center; gap: 11px; padding: 18px 22px; border-bottom: 1px solid var(--line); background: #fcfbfd; }
.interviewer-avatar { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; color: white; background: linear-gradient(145deg, #2d2948, #7663d7); font-size: 11px; font-weight: 800; }
.interviewer-presence > div:nth-child(2) { display: flex; flex-direction: column; }.interviewer-presence strong { font-size: 10px; }.interviewer-presence span { margin-top: 2px; color: var(--muted); font-size: 8px; }
.live-pill { margin: 0 0 0 auto !important; padding: 6px 9px; border-radius: 15px; color: var(--green) !important; background: var(--green-soft); font-weight: 700; }
.live-pill i { display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: var(--green); animation: live-pulse 1.5s infinite; }
@keyframes live-pulse { 50% { box-shadow: 0 0 0 4px rgba(68,169,130,.15); } }
.interview-question-card { flex: 1; padding: 31px 32px 25px; }
.interviewer-prompt { max-width: 760px; min-height: 66px; margin: 9px 0 24px; font: 700 20px/1.5 var(--font-display); letter-spacing: -.3px; }
.qcm-options { display: grid; gap: 9px; }
.qcm-option { display: flex; align-items: center; gap: 13px; width: 100%; padding: 13px 15px; border: 1px solid var(--line); border-radius: 11px; color: #4f4b5c; background: white; text-align: left; cursor: pointer; transition: .18s; }
.qcm-option:hover:not(:disabled) { border-color: #bdb0f6; background: #fbfaff; transform: translateX(2px); }
.qcm-option > span { width: 27px; height: 27px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; color: var(--purple); background: var(--purple-soft); font-size: 9px; font-weight: 800; }
.qcm-option strong { font-size: 10px; font-weight: 600; line-height: 1.45; }
.qcm-option.selected { border-color: var(--purple); background: #f9f7ff; box-shadow: 0 0 0 2px var(--purple-soft); }
.qcm-option.selected > span { color: white; background: var(--purple); }
.qcm-option:disabled:not(.selected) { opacity: .45; cursor: default; }
.simulator-reaction { display: flex; gap: 11px; margin: 0 32px 20px; padding: 13px; border-radius: 10px; color: #615b75; background: var(--purple-soft); }
.simulator-reaction.reaction-positive { color: #39785f; background: var(--green-soft); }.simulator-reaction.reaction-negative { color: #98603d; background: var(--orange-soft); }
.reaction-icon { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 8px; background: rgba(255,255,255,.7); }.reaction-icon .icon { width: 15px; }
.simulator-reaction strong { font-size: 9px; }.simulator-reaction p { margin: 3px 0 0; font-size: 9px; line-height: 1.45; }
.simulator-dialogue-footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 15px 22px; border-top: 1px solid var(--line); }
.simulator-dialogue-footer > span { color: var(--muted); font-size: 8px; }
.satisfaction-panel { position: sticky; top: 92px; z-index: 9; align-self: start; padding: 20px; transition: border-color .3s; }
.satisfaction-panel h2 { margin: 5px 0 14px; font: 700 16px var(--font-display); }
.recruiter-mood { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding: 10px 12px; border-radius: 14px; background: #faf9fc; }
.recruiter-mood span { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 12px; background: white; font-size: 23px; box-shadow: inset 0 0 0 1px rgba(27,24,58,.06); }
.recruiter-mood strong { color: #4d4960; font-size: 13px; line-height: 1.25; }
.satisfaction-display { display: grid; grid-template-columns: 93px 1fr; align-items: center; gap: 15px; }
.satisfaction-gauge { position: relative; width: 22px; height: 245px; margin-left: 25px; border-radius: 20px; background: linear-gradient(to top, #f7d7cd 0 33%, #f2ecdc 33% 66%, #dff3e9 66%); box-shadow: inset 0 0 0 1px rgba(31,28,49,.06); }
.satisfaction-fill { --satisfaction: 52; position: absolute; inset: auto 0 0; height: calc(var(--satisfaction) * 1%); border-radius: 20px; background: linear-gradient(to top, #e1705f, #efb75f 48%, #46ad84); transition: height .45s ease; }
.satisfaction-fill::after { content: ""; position: absolute; top: -5px; left: 50%; width: 31px; height: 10px; transform: translateX(-50%); border: 3px solid white; border-radius: 8px; background: var(--ink); box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.gauge-mark { position: absolute; left: 37px; color: var(--muted); font-size: 7px; white-space: nowrap; }.gauge-high { top: 2px; }.gauge-mid { top: 50%; }.gauge-low { bottom: 1px; }
.satisfaction-score { display: flex; flex-direction: column; align-items: center; text-align: center; }
.satisfaction-face { width: 55px; height: 55px; display: grid; place-items: center; margin-bottom: 10px; border-radius: 50%; color: var(--purple); background: var(--purple-soft); font: 800 20px var(--font-display); }
.satisfaction-score strong { font: 800 26px var(--font-display); }.satisfaction-score > span:last-child { color: var(--muted); font-size: 9px; font-weight: 700; }
.satisfaction-panel[data-mood="excellent"] { border-color: #a9ddc8; }.satisfaction-panel[data-mood="negative"] { border-color: #f0b8a7; }
.satisfaction-caption { margin: 14px 0; padding: 11px 0; border-block: 1px solid var(--line); color: var(--muted); font-size: 8px; line-height: 1.5; }
.observed-skills > span { color: #9b97a5; font-size: 7px; font-weight: 800; letter-spacing: 1px; }
#liveSoftSkills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.live-skill { padding: 5px 7px; border-radius: 6px; color: #777381; background: #f4f3f6; font-size: 7px; font-weight: 700; }
.live-skill i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #bbb8c3; }.live-skill.positive i { background: var(--green); }.live-skill.negative i { background: #df765e; }
.simulator-results-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 25px; padding: 28px; background: linear-gradient(120deg, white, #faf9ff); }
.result-score-ring { --result-score: 78; width: 110px; height: 110px; position: relative; display: grid; place-items: center; border-radius: 50%; background: conic-gradient(var(--purple) calc(var(--result-score) * 1%), #ebe9f1 0); }
.result-score-ring::before { content: ""; position: absolute; inset: 8px; border-radius: 50%; background: white; }.result-score-ring > span { z-index: 1; display: flex; flex-direction: column; align-items: center; }.result-score-ring strong { font: 800 22px var(--font-display); }.result-score-ring small { color: var(--muted); font-size: 7px; }
.simulator-results-hero h2 { margin: 5px 0; font: 800 23px var(--font-display); }.simulator-results-hero p { max-width: 650px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.simulator-results-grid { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 18px; margin-top: 18px; }.softskills-results, .result-advice { padding: 25px; }
#softSkillsResults { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 25px; }.result-skill > div:first-child { display: flex; justify-content: space-between; margin-bottom: 7px; font-size: 9px; }.result-skill strong { color: var(--purple); }
.result-advice h2 { margin: 6px 0 10px; font: 700 17px var(--font-display); }.result-advice > p { min-height: 90px; color: var(--muted); font-size: 10px; line-height: 1.65; }
.result-advice .button + .button { margin-top: 9px; }
.external-review-modal { width: min(860px, 95vw); padding: 30px; overflow: auto; background: white; }
.external-review-modal .modal-close { top: 15px; right: 15px; }
.external-review-head { display: flex; align-items: flex-start; gap: 16px; padding-right: 40px; margin-bottom: 22px; }
.external-review-head .modal-icon { flex: 0 0 48px; }
.external-review-head h2 { margin: 3px 0 4px; font-size: 24px; }
.external-review-head p { margin: 0; color: var(--muted); font-size: 13px; }
.external-review-head .section-kicker { color: var(--purple); font-size: 11px; }
.external-review-field { gap: 9px; font-size: 13px; }
#externalReviewPrompt { min-height: 390px; padding: 17px; border-radius: 13px; background: #faf9fc; font: 400 14px/1.55 var(--font-sans); resize: vertical; }
.external-review-footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 16px; }
.external-review-footer p { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--muted); font-size: 12px; }
.external-review-footer p .icon { color: var(--green); }
.external-review-footer .button { min-width: 190px; }

/* Accessibility and visual coherence */
.main-column,
main,
.view,
.stats-grid > *,
.dashboard-grid > *,
.jobs-layout > *,
.campaigns-layout > *,
.campaign-work-grid > *,
.skills-layout > *,
.profile-layout > *,
.documents-layout > *,
.pricing-grid > *,
.cv-layout > *,
.detail-grid > * {
  min-width: 0;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid rgba(111, 82, 237, .32);
  outline-offset: 3px;
}

.check-pill input:focus-visible + span {
  outline: 3px solid rgba(111, 82, 237, .32);
  outline-offset: 3px;
}

.icon-button {
  width: 42px;
  height: 42px;
}

.button {
  min-height: 46px;
  padding-inline: 18px;
  font-size: 15px;
}

.text-button {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 7px 5px;
  font-size: 14px;
}

.search-wrap {
  min-width: 0;
}

.search-wrap input {
  height: 46px;
  font-size: 15px;
}

.page-head p {
  font-size: 16px;
}

.section-kicker {
  font-size: 13px !important;
}

.focus-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

.focus-pill .icon {
  color: #d9783f;
}

.stat-card span,
.skill-bar-item > div:first-child,
.task-progress > div:first-child,
.pipeline-legend li,
.priority-skill,
.keyword-match > div:first-child {
  font-size: 14px;
}

.stat-card small,
.job-title-row p,
.job-list-content > p,
.task-card p,
.tip-card p,
.job-meta,
.empty-suggestion p,
.pipeline-tip p,
.skills-summary article div span,
.opportunity-panel > p,
.profile-summary > p,
.form-section p,
.cv-tab-panel > p,
.ats-tip p,
.editor-footer > span,
.modal-job-brand p,
.detail-block p,
.detail-side-card p,
.questions-head p,
.interview-intro > p,
.answer-hint,
.small-modal > p,
.toast p {
  font-size: 14px;
}

.tag,
.muted,
.match-row span,
.save-state,
.matrix-legend,
.coverage-ring small,
.completion-ring small,
.ats-badge small,
.preview-toolbar,
.modal-score > span,
.modal-score small,
.modal-tabs button,
.marker-list span,
.caution ul,
.interview-features span,
.interview-progress span,
.question-category {
  font-size: 13px;
}

.progress-mini-head,
.progress-mini a,
.user-chip small,
.stage strong,
.opportunity-panel h3,
.form-section-head > span,
label,
.contract-fieldset legend,
.check-pill span,
.priority-chips button,
.ats-badge strong,
.cv-tabs button,
.mission-grid span,
.check-list li,
.marker-list b,
.question-item span {
  font-size: 14px;
}

.user-chip strong,
.empty-suggestion strong,
.matrix-name,
.task-card h3 {
  font-size: 15px;
}

.job-insight p,
.stage small {
  font-size: 13px;
}

.nav-item {
  min-height: 52px;
  font-size: 15px;
}

.nav-count,
.progress-mini-head,
.progress-mini a,
.user-chip small,
kbd {
  font-size: 12px;
}

.user-chip strong,
.search-wrap input::placeholder {
  font-size: 14px;
}

.panel-head h2,
.job-list-content h2,
.pipeline-card h2,
.opportunity-panel h2,
.profile-summary h2 {
  font-size: 20px;
}

.job-title-row h3,
.cv-tab-panel h2,
.form-section h2 {
  font-size: 17px;
}

.latest-jobs-count,
.latest-job-source strong,
.latest-job-source small,
.latest-job-content > p,
.latest-job-meta,
.latest-job-link {
  font-size: 13px;
}

.latest-job-content h3 {
  font-size: 16px;
}

.filter-tabs button,
.ats-badge strong,
.ats-badge small,
.cv-tabs button,
.editor-footer > span,
.preview-toolbar,
.modal-tabs button,
.modal-tabs button span {
  font-size: 13px;
}

.score-ring small,
.task-date span,
.stage small {
  font-size: 11px;
}

.score-ring strong {
  font-size: 17px;
}

.task-date strong {
  font-size: 22px;
}

.modal-job-brand h2 {
  font-size: 22px;
}

.detail-block h3,
.detail-side-card h3 {
  font-size: 17px;
}

.lead-block p {
  font-size: 15px;
}

.verdict-score {
  font-size: 21px;
}

.rich-list strong {
  font-size: 14px;
}

.questions-head h3 {
  font-size: 21px;
}

.question-item input {
  flex-basis: 20px;
  width: 20px;
  height: 20px;
}

.interview-intro > p,
.small-modal > p {
  font-size: 15px;
}

.interview-features span,
.interview-progress span,
.question-category {
  font-size: 13px;
}

.answer-hint {
  font-size: 14px;
}

input,
select,
textarea {
  font-size: 16px;
}

input,
select {
  height: 46px;
}

label,
.contract-fieldset legend,
.check-pill span,
.priority-chips button {
  font-size: 14px;
}

.job-insight p,
.tip-card p,
.pipeline-tip p,
.ats-tip p,
.detail-block p,
.detail-side-card p,
.question-item span,
.small-modal > p {
  line-height: 1.55;
}

.panel-head {
  flex-wrap: wrap;
}

.job-meta span,
.caution h3 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.job-meta .icon {
  color: var(--purple);
}

.tip-card > .icon,
.ats-tip > .icon,
.pipeline-tip > .icon {
  margin-top: 2px;
  color: currentColor;
}

.suggestion-icon {
  width: 38px;
  height: 38px;
  padding: 9px;
  border-radius: 10px;
  color: var(--purple);
  background: white;
}

.summary-icon .icon,
.ats-badge .icon,
.large-avatar .icon,
.modal-icon .icon,
.interview-orb .icon {
  width: 20px;
  height: 20px;
}

.large-avatar button {
  display: grid;
  place-items: center;
  cursor: pointer;
}

.large-avatar button .icon {
  width: 13px;
  height: 13px;
}

.caution h3 .icon {
  color: #bd6b2d;
}

.toast > .icon {
  color: #77d6af;
}

.level-selector button {
  min-height: 12px;
}

.remove-skill,
.view-toggle button,
.preview-toolbar button {
  min-width: 32px;
  min-height: 32px;
}

.campaign-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; margin-bottom: 18px; }
.campaign-stat-card { min-height: 112px; display: flex; align-items: center; gap: 15px; padding: 21px; border: 1px solid var(--line); border-radius: 17px; background: white; box-shadow: var(--shadow); }
.campaign-stat-card strong { display: block; font: 900 28px/1 var(--font-display); letter-spacing: -1px; }
.campaign-stat-card span:last-child { color: var(--muted); font-size: 13px; }
.campaign-list-view { display: grid; gap: 18px; }
.campaigns-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 22px; }
.campaigns-toolbar h2 { margin: 0 0 5px; font: 850 23px/1.1 var(--font-display); letter-spacing: -.7px; }
.campaigns-toolbar p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.campaign-layout-toggle button { min-width: 32px; }
.campaigns-layout { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 20px; align-items: start; }
.campaigns-sidebar { position: sticky; top: 96px; padding: 22px; }
.campaigns-sidebar .panel-head { align-items: flex-start; margin-bottom: 15px; }
.campaigns-sidebar .panel-head h2,
.campaign-todo-panel .panel-head h2,
.campaign-kanban-panel .panel-head h2 { margin: 0 0 4px; font: 850 21px/1.1 var(--font-display); letter-spacing: -.6px; }
.campaigns-sidebar .panel-head p,
.campaign-todo-panel .panel-head p,
.campaign-kanban-panel .panel-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.campaign-list { display: grid; gap: 14px; }
.campaign-list.is-grid { grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.campaign-list.is-list { grid-template-columns: 1fr; }
.campaign-list-card { width: 100%; display: grid; gap: 8px; padding: 14px; border: 1px solid var(--line); border-radius: 15px; background: #fbfaff; color: inherit; text-align: left; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.campaign-list-card:hover,
.campaign-list-card:focus-visible { border-color: #cfc5fa; box-shadow: 0 14px 30px rgba(111,82,237,.1); transform: translateY(-1px); outline: none; }
.campaign-list-card.active { border-color: var(--purple); background: white; box-shadow: 0 16px 34px rgba(111,82,237,.12); }
.campaign-list.is-grid .campaign-list-card { min-height: 210px; align-content: start; padding: 18px; }
.campaign-list.is-list .campaign-list-card { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 9px 18px; padding: 17px 19px; }
.campaign-list.is-list .campaign-list-card-top,
.campaign-list.is-list .campaign-progress-line { grid-column: 1 / -1; }
.campaign-list.is-list .campaign-list-target,
.campaign-list.is-list .campaign-list-stage { grid-column: 1; }
.campaign-list.is-list .campaign-list-open { grid-column: 2; grid-row: 2 / span 2; align-self: center; }
.campaign-list-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.campaign-list-card strong { font-size: 15px; line-height: 1.25; }
.campaign-list-card > span:not(.campaign-list-card-top):not(.campaign-progress-line) { color: var(--muted); font-size: 12px; }
.campaign-list-card .campaign-list-target { display: -webkit-box; overflow: hidden; font-size: 14px; line-height: 1.45; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.campaign-list-stage { color: #6b6576 !important; font-weight: 800; }
.campaign-list-open { display: inline-flex; width: fit-content; align-items: center; gap: 7px; margin-top: auto; color: var(--purple) !important; font-size: 13px !important; font-weight: 900; }
.campaign-list-open .icon { width: 15px; height: 15px; }
.campaign-type-pill { display: inline-flex; width: fit-content; align-items: center; padding: 6px 9px; border-radius: 999px; color: var(--purple); background: var(--purple-soft); font-size: 10px; font-weight: 900; text-transform: uppercase; letter-spacing: .45px; }
.campaign-progress-line { height: 6px; overflow: hidden; border-radius: 999px; background: #efedf4; }
.campaign-progress-line i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--purple), #9b83ff); }
.campaign-empty,
.campaign-placeholder { display: grid; place-items: center; gap: 9px; padding: 34px 20px; border: 1px dashed #d8d3e5; border-radius: 18px; background: white; text-align: center; }
.campaign-empty h3,
.campaign-placeholder h2 { margin: 0; font-size: 20px; }
.campaign-empty p,
.campaign-placeholder p { margin: 0 0 8px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.campaign-workspace { display: grid; gap: 18px; min-width: 0; max-width: 100%; }
.campaign-detail-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 15px; background: white; box-shadow: var(--shadow); }
.campaign-detail-toolbar > span { color: var(--muted); font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .45px; }
.campaign-back-button { display: inline-flex; align-items: center; gap: 8px; }
.campaign-back-button .icon { width: 15px; height: 15px; transform: rotate(180deg); }
.campaign-detail-card { padding: 24px; }
.campaign-detail-head { display: flex; justify-content: space-between; gap: 18px; align-items: flex-start; margin-bottom: 16px; }
.campaign-detail-head h2 { margin: 10px 0 6px; font: 900 30px/1.05 var(--font-display); letter-spacing: -1.1px; }
.campaign-detail-head p { margin: 0; color: var(--muted); font-size: 14px; }
.campaign-stage-chip { flex: 0 0 auto; display: grid; gap: 4px; min-width: 130px; padding: 12px 14px; border-radius: 15px; color: var(--purple); background: var(--purple-soft); text-align: right; }
.campaign-stage-chip span { font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .4px; }
.campaign-stage-chip strong { font: 900 28px/1 var(--font-display); }
.campaign-detail-meta { display: flex; flex-wrap: wrap; gap: 9px; }
.campaign-detail-meta span { display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 10px; color: #5f5b6c; background: #f4f3f7; font-size: 12px; font-weight: 800; }
.campaign-notes { margin: 15px 0 0; padding: 13px 14px; border-left: 4px solid var(--purple); border-radius: 12px; color: #4b475c; background: #fbfaff; font-size: 13px; line-height: 1.55; }
.campaign-work-grid { display: grid; grid-template-columns: 1fr; gap: 18px; align-items: start; }
.campaign-todo-panel,
.campaign-kanban-panel { min-width: 0; padding: 22px; }
.campaign-todo-panel .panel-head,
.campaign-kanban-panel .panel-head { margin-bottom: 15px; }
.campaign-todo-panel .panel-head strong { color: var(--purple); font: 900 23px/1 var(--font-display); }
.campaign-progress-track { height: 8px; overflow: hidden; margin-bottom: 16px; border-radius: 999px; background: #efedf4; }
.campaign-progress-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--purple), #9b83ff); }
.campaign-todo-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.campaign-todo-item { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: flex-start; padding: 12px; border: 1px solid var(--line); border-radius: 13px; background: #faf9fc; cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.campaign-todo-item:hover { border-color: #d5ccff; background: #fbfaff; }
.campaign-todo-item input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--purple); }
.campaign-todo-item span { color: #4d495b; font-size: 13px; line-height: 1.45; }
.campaign-todo-item.done span { color: #8c8799; text-decoration: line-through; }
.campaign-kanban { width: 100%; max-width: 100%; min-height: 285px; display: flex; gap: 12px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x proximity; }
.campaign-kanban-column { flex: 0 0 210px; display: grid; grid-template-rows: auto 1fr; min-height: 270px; border: 1px solid var(--line); border-radius: 16px; background: #faf9fc; scroll-snap-align: start; }
.campaign-kanban-column header { display: flex; justify-content: space-between; gap: 10px; padding: 12px; border-bottom: 1px solid var(--line); }
.campaign-kanban-column header strong { font-size: 12px; line-height: 1.25; }
.campaign-kanban-column header span { min-width: 22px; height: 22px; display: grid; place-items: center; border-radius: 999px; color: var(--muted); background: white; font-size: 11px; font-weight: 900; }
.campaign-kanban-column.active { border-color: #cfc5fa; background: white; box-shadow: 0 18px 34px rgba(111,82,237,.1); }
.campaign-kanban-dropzone { min-height: 210px; display: grid; align-content: start; padding: 10px; border-radius: 0 0 16px 16px; transition: background .2s ease, box-shadow .2s ease; }
.campaign-kanban-dropzone.drag-over,
.campaign-kanban-column.drag-over { background: var(--purple-soft); box-shadow: inset 0 0 0 2px rgba(111,82,237,.22); }
.campaign-kanban-card { display: grid; gap: 8px; padding: 13px; border: 1px solid #d8d0ff; border-radius: 14px; background: white; box-shadow: 0 12px 26px rgba(27,24,58,.08); cursor: grab; }
.campaign-kanban-card.dragging { opacity: .65; }
.campaign-kanban-card h3 { margin: 0; font: 850 15px/1.2 var(--font-display); }
.campaign-kanban-card p { margin: 0; color: var(--muted); font-size: 12px; }
.campaign-kanban-card small { color: var(--purple); font-size: 11px; font-weight: 800; }
.kanban-move-button { width: 100%; min-height: 44px; align-self: start; border: 1px dashed #d8d3e5; border-radius: 12px; color: #8a8498; background: white; font-size: 12px; font-weight: 800; cursor: pointer; transition: color .2s ease, border-color .2s ease, background .2s ease; }
.kanban-move-button:hover,
.kanban-move-button:focus-visible { color: var(--purple); border-color: #cfc5fa; background: var(--purple-soft); outline: none; }
.campaign-modal { width: min(620px, 94vw); }
.campaign-form { display: grid; gap: 14px; margin-top: 18px; text-align: left; }
.campaign-form label { display: grid; gap: 7px; color: #4e4a5d; font-size: 13px; font-weight: 800; }
.campaign-form input,
.campaign-form select,
.campaign-form textarea { width: 100%; border: 1px solid var(--line); border-radius: 12px; background: #faf9fc; color: var(--ink); padding: 12px 13px; outline: none; transition: border-color .2s ease, box-shadow .2s ease; }
.campaign-form input:focus,
.campaign-form select:focus,
.campaign-form textarea:focus { border-color: #bfb3ff; box-shadow: 0 0 0 4px rgba(111,82,237,.1); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (max-width: 1100px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .dashboard-grid, .skills-layout, .documents-layout, .campaigns-layout, .campaign-work-grid { grid-template-columns: 1fr; }
  .campaigns-toolbar { align-items: flex-start; flex-direction: column; }
  .campaign-list.is-grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
  .campaigns-sidebar { position: static; }
  .next-panel { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; }.next-panel .panel-head { grid-column: 1 / -1; }.next-panel .tip-card { margin-top: 0; }
  .latest-jobs-list { grid-template-columns: 1fr; }
  .skill-bars { grid-template-columns: repeat(2, 1fr); }
  .cv-layout { grid-template-columns: 1fr; }.cv-preview-wrap { position: static; }
  .charts-grid { grid-template-columns: 1fr 1fr; }
  .chart-card-wide { grid-column: 1 / -1; grid-row: auto; }
  .chart-card-wide .chart-wrap { height: 300px; }
  .interviewer-profiles { grid-template-columns: 1fr; }
  .interviewer-profile-card > p { min-height: 0; }
  .simulator-session-layout { grid-template-columns: 1fr; }
  .satisfaction-panel { order: -1; top: 84px; display: grid; grid-template-columns: minmax(170px, .32fr) minmax(0, 1fr); gap: 14px 20px; padding: 16px; }
  .satisfaction-panel > .section-kicker, .satisfaction-panel > h2 { grid-column: 1 / -1; }
  .recruiter-mood { grid-column: 1 / -1; margin-bottom: 0; }
  .satisfaction-gauge { width: 190px; height: 18px; margin: 0; background: linear-gradient(to right, #f7d7cd 0 33%, #f2ecdc 33% 66%, #dff3e9 66%); }
  .satisfaction-fill { inset: 0 auto 0 0; width: calc(var(--satisfaction) * 1%); height: 100% !important; transition: width .45s ease; }
  .satisfaction-fill::after { top: 50%; left: auto; right: -5px; width: 10px; height: 30px; transform: translateY(-50%); }
  .gauge-mark { top: 29px; left: auto; }.gauge-high { right: 0; }.gauge-mid { left: 50%; }.gauge-low { left: 0; bottom: auto; }
  .satisfaction-display { display: flex; flex-direction: column-reverse; align-items: flex-start; }
  .satisfaction-score { flex-direction: row; gap: 10px; }.satisfaction-face { width: 40px; height: 40px; margin: 0; }
  .watch-layout { grid-template-columns: minmax(0, 760px); justify-content: center; }
  .announcements-search { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .watch-sidebar { position: static; }
  .journey-layout { grid-template-columns: 1fr; }
  .journey-score-card { position: static; }
  .cv-upload-hero, .cv-feedback-grid { grid-template-columns: 1fr; }
  .cv-sync-banner { align-items: flex-start; flex-direction: column; }
  .settings-hero, .subscription-hero, .help-hero, .pricing-hero, .formation-hero, .formation-layout { grid-template-columns: 1fr; }
  .subscription-layout { grid-template-columns: 1fr; }
  .help-journey, .help-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .formation-sidebar { position: static; }
  .pricing-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pricing-card-featured { transform: none; }
}
@media (max-width: 850px) {
  .auth-card { grid-template-columns: 1fr; }.auth-hero { min-height: auto; padding: 35px; }.auth-form { padding: 35px; }
  body.app-menu-open { overflow: hidden; }
  .app-shell,
  .app-shell.is-sidebar-compact,
  .app-shell.is-sidebar-hidden { --sidebar-width: 0px; }
  .app-menu-backdrop {
    position: fixed;
    inset: 0;
    z-index: 44;
    display: none;
    padding: 0;
    border: 0;
    background: rgba(14, 13, 25, .52);
    backdrop-filter: blur(7px);
    cursor: pointer;
  }
  .app-menu-backdrop.is-open {
    display: block;
    animation: fade .18s ease;
  }
  .sidebar-mode-switcher { display: none; }
  .sidebar { z-index: 45; width: 250px; transform: translateX(-100%); visibility: visible; pointer-events: auto; transition: transform .25s; box-shadow: 20px 0 50px rgba(0,0,0,.2); }.sidebar.open { transform: none; }
  .app-shell.is-sidebar-hidden .sidebar { transform: translateX(-100%); visibility: visible; pointer-events: auto; }
  .app-shell.is-sidebar-hidden .sidebar.open { transform: none; }
  .app-shell.is-sidebar-compact .sidebar { padding: 31px 18px 20px; }
  .app-shell.is-sidebar-compact .brand { justify-content: flex-start; gap: 11px; padding: 0 12px 35px; }
  .app-shell.is-sidebar-compact .brand-name { display: inline-flex; }
  .app-shell.is-sidebar-compact .nav-item { justify-content: flex-start; gap: 13px; padding: 0 14px; }
  .app-shell.is-sidebar-compact .nav-item > span { display: inline; }
  .app-shell.is-sidebar-compact .nav-count { display: grid; }
  .app-shell.is-sidebar-compact .nav-live { display: inline-flex; }
  .app-shell.is-sidebar-compact .sidebar-bottom { display: block; }
  .main-column { padding-left: 0; }.mobile-menu { display: grid; }.topbar { padding: 0 20px; }.search-wrap { flex: 1; width: auto; min-width: 0; }
  .app-shell.is-user-menu-open .topbar { z-index: 55; }
  .app-shell.is-user-menu-open .user-menu { z-index: 56; }
  .app-shell.is-user-menu-open .user-dropdown {
    position: fixed;
    top: 88px;
    right: 20px;
    z-index: 56;
    width: min(300px, calc(100vw - 40px));
    border-radius: 20px;
    box-shadow: 0 24px 60px rgba(14, 13, 25, .24);
  }
  main { padding: 0 20px 45px; }.page-head { min-height: 135px; }.jobs-layout, .profile-layout { grid-template-columns: 1fr; }.profile-summary { display: none; }
  #announcements .watch-filters {
    top: 78px;
    z-index: 14;
    margin: 0 -20px 12px;
    padding: 8px 20px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: rgba(247,247,250,.97);
    box-shadow: 0 10px 24px rgba(27,24,58,.08);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  }
  #announcements .watch-filters.is-scroll-hidden {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);
    pointer-events: none;
  }
  .pipeline-card { display: none; }.detail-grid { grid-template-columns: 1fr; }.modal { width: 96vw; }.modal-header { padding: 22px; }.modal-tabs { padding: 0 12px; overflow-x: auto; }.modal-body { padding: 20px; }
  .charts-grid { grid-template-columns: 1fr; }
  .chart-card-wide { grid-column: auto; }
  .simulator-guide { grid-template-columns: 1fr; }.simulator-guide-steps { grid-template-columns: 1fr 1fr; }
  .simulator-intro { align-items: flex-start; flex-direction: column; }.simulator-intro-meta { width: 100%; justify-content: space-around; }
  .simulator-phases { overflow-x: auto; }.simulator-phase { min-width: 150px; }
  .simulator-results-grid { grid-template-columns: 1fr; }
  .satisfaction-panel { top: 78px; grid-template-columns: 1fr; }
  .satisfaction-panel h2,
  .satisfaction-caption,
  .observed-skills { display: none; }
  .recruiter-mood { padding: 8px 10px; }
  .recruiter-mood span { width: 34px; height: 34px; font-size: 21px; }
  .satisfaction-display { gap: 8px; }
  .satisfaction-score strong { font-size: 20px; }
  .watch-sidebar { display: none; }
  .settings-hero, .subscription-hero, .help-hero, .pricing-hero, .formation-hero { padding: 28px; }
  .settings-layout, .settings-rgpd-actions { grid-template-columns: 1fr; }
  .settings-security-card, .settings-rgpd { grid-column: auto; }
  .settings-security-grid { grid-template-columns: 1fr; }
  .subscription-current-card, .subscription-upgrade-card, .subscription-invoices-card { grid-column: auto; }
  .subscription-cancel-card { grid-column: auto; }
  .help-plan-grid { grid-template-columns: 1fr; }
  .formation-stats { grid-template-columns: 1fr; }
  .formation-catalog { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .trap-question-card { grid-template-columns: 1fr; }
  .trap-question-meta { grid-template-columns: 1fr; }
  .auth-screen { padding: 14px; }.auth-card { max-width: calc(100vw - 28px); border-radius: 20px; }.auth-hero, .auth-form { padding: 24px; }.auth-hero h1 { font-size: 32px; }
  .topbar { height: 66px; gap: 10px; padding: 0 14px; }.topbar .button-primary { width: 44px; padding: 0; overflow: hidden; font-size: 12px; white-space: nowrap; }.topbar .button-primary .icon { width: 19px; height: 19px; }.notification-button, kbd { display: none; }
  .satisfaction-panel { top: 66px; }
  .user-menu-toggle { min-height: 44px; max-width: 44px; padding: 4px; border: 0; background: transparent; box-shadow: none; }
  .user-menu-toggle:hover, .user-menu-toggle:focus-visible { box-shadow: none; transform: none; }
  .user-menu-toggle .avatar { flex-basis: 38px; width: 38px; height: 38px; }
  .user-menu-toggle > span:nth-child(2), .user-menu-chevron { display: none; }
  .user-dropdown { top: 74px; right: 14px; width: min(280px, calc(100vw - 28px)); }
  .mobile-menu { flex: 0 0 44px; width: 44px; height: 44px; }.top-actions { flex: 0 0 auto; gap: 8px; }
  .toast {
    left: 50%;
    right: auto;
    bottom: calc(92px + env(safe-area-inset-bottom));
    width: min(340px, calc(100vw - 32px));
    justify-content: center;
    text-align: center;
    transform: translate(-50%, 100px);
  }
  .toast.show { transform: translate(-50%, 0); }
  .toast-action { flex: 0 0 auto; }
  .search-wrap input { padding-right: 12px; text-overflow: ellipsis; }
  .page-head { align-items: flex-start; flex-direction: column; justify-content: center; gap: 12px; padding: 22px 0; }.focus-pill { display: none; }
  main { padding: 0 16px calc(116px + env(safe-area-inset-bottom)); }
  .sidebar { z-index: 45; }
  .mobile-bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 35;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 2px;
    min-height: calc(74px + env(safe-area-inset-bottom));
    padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(233, 231, 239, .92);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 -18px 40px rgba(27, 24, 58, .12);
    backdrop-filter: blur(16px);
  }
  .mobile-bottom-nav .mobile-bottom-nav-item {
    min-width: 0;
    min-height: 56px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 4px;
    padding: 6px 2px;
    border-radius: 16px;
    color: #777287;
    background: transparent;
    box-shadow: none;
    font-size: 9px;
    font-weight: 850;
    line-height: 1.05;
    text-align: center;
    letter-spacing: -.1px;
  }
  .mobile-bottom-nav .mobile-bottom-nav-item svg {
    width: 22px;
    height: 22px;
  }
  .mobile-bottom-nav .mobile-bottom-nav-item span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mobile-bottom-nav .mobile-bottom-nav-item:hover,
  .mobile-bottom-nav .mobile-bottom-nav-item:focus-visible {
    color: var(--purple);
    background: var(--purple-soft);
    outline: none;
  }
  .mobile-bottom-nav .mobile-bottom-nav-item.active {
    color: var(--purple);
    background: linear-gradient(180deg, #f3efff, #ffffff);
    box-shadow: inset 0 0 0 1px rgba(111, 82, 237, .16), 0 8px 20px rgba(111, 82, 237, .1);
  }
  .mobile-bottom-nav .mobile-bottom-nav-item.active svg {
    stroke-width: 2.2;
  }
  .stats-grid { grid-template-columns: 1fr; gap: 10px; }.stat-card { min-height: 92px; padding: 16px; gap: 14px; }.stat-icon { flex-basis: 40px; height: 40px; }.stat-card strong { font-size: 24px; }.formation-hero { padding: 24px; border-radius: 22px; }.formation-hero h1 { font-size: 34px; letter-spacing: -1.4px; }.training-card, .formation-sidebar { padding: 18px; }
  .dashboard-grid { margin-top: 12px; }.priority-panel, .next-panel, .skills-preview { padding: 17px; }.featured-job { padding: 14px; overflow: hidden; }.featured-job > .company-logo { display: none; }.job-title-row { display: grid; grid-template-columns: minmax(0, 1fr) 58px; }.job-title-row p { line-height: 1.5; }.featured-footer { align-items: stretch; flex-direction: column; gap: 12px; }.featured-actions { display: grid; grid-template-columns: 1fr 1fr; }.featured-footer .button { min-width: 0; padding: 0 10px; font-size: 13px; }.featured-footer .button .icon { width: 18px; height: 18px; }
  .priority-panel .panel-head { flex-wrap: nowrap; gap: 10px; }.priority-panel .panel-head .text-button { flex: 0 0 auto; font-size: 13px; }
  .job-insight p { overflow-wrap: anywhere; }
  .next-panel { display: block; }.next-panel .tip-card { margin-top: 14px; }.latest-jobs-panel { padding: 17px; }.latest-jobs-count { display: none; }.latest-job-card { padding: 15px; }.skills-preview { display: none; }
  .dashboard-section-head { align-items: flex-start; flex-direction: column; }.chart-period { display: none; }
  .chart-card { padding: 16px; }.chart-wrap, .chart-card-wide .chart-wrap { height: 250px; }.chart-wrap-donut { height: 190px; }
  .filter-row { align-items: flex-start; gap: 10px; }.filter-tabs { overflow-x: auto; padding-bottom: 4px; }.filter-tabs button { white-space: nowrap; }.view-toggle { display: none; }
  .job-list-card { padding: 18px 14px; }.job-list-card > .company-logo { flex-basis: 40px; width: 40px; height: 40px; }.job-list-head .muted { display: none; }.job-meta { gap: 9px; }.job-card-actions { justify-content: flex-start; margin-right: 0; }.empty-suggestion { align-items: stretch; flex-direction: column; padding: 15px; }.empty-suggestion-action { width: 100%; }
  .skills-summary, .campaign-stats { grid-template-columns: 1fr; gap: 8px; }.matrix-panel { padding: 17px; overflow-x: auto; }.matrix-legend { width: 370px; margin-left: 145px; }.matrix-row { width: 515px; grid-template-columns: 145px 335px 30px; }.matrix-name { font-size: 14px; }
  .campaign-detail-head { align-items: stretch; flex-direction: column; }
  .campaign-list.is-list .campaign-list-card { grid-template-columns: 1fr; }
  .campaign-list.is-list .campaign-list-open,
  .campaign-list.is-list .campaign-list-target,
  .campaign-list.is-list .campaign-list-stage { grid-column: 1; grid-row: auto; }
  .campaign-detail-toolbar { align-items: flex-start; flex-direction: column; }
  .campaign-stage-chip { text-align: left; }
  .campaign-todo-list { grid-template-columns: 1fr; }
  .campaign-kanban { margin-right: -16px; padding-right: 16px; }
  .campaign-kanban-column { flex-basis: 195px; }
  .campaign-modal { padding: 24px 18px; }
  .form-grid { grid-template-columns: 1fr; }.span-2 { grid-column: auto; }.profile-form { padding: 19px; }.add-job-options, .add-job-step[data-add-job-step="choice"] { grid-template-columns: 1fr; }
  .tag-editor-entry { grid-template-columns: 1fr; }
  .tag-editor-entry .button { width: 100%; }
  .add-job-choice { min-height: 0; }
  .add-job-form-head { align-items: flex-start; flex-direction: column-reverse; }
  .documents-browser-head { align-items: flex-start; flex-direction: column; }.documents-folder-actions { flex-wrap: wrap; }.document-file-card { grid-template-columns: 46px minmax(0, 1fr); }.document-file-card time { grid-column: 2; }.storage-gauge { align-items: flex-start; flex-direction: column; }
  .cv-layout { display: block; }.cv-preview-wrap { margin-top: 18px; padding: 8px; overflow-x: auto; }.cv-paper { width: 595px; transform: scale(.78); transform-origin: top left; margin-bottom: -165px; }.cv-tabs { overflow-x: auto; }.cv-tabs button { min-width: 80px; }.cv-tab-panel { padding: 20px; }.cv-experience-toolbar { align-items: stretch; flex-direction: column; }.cv-add-experience { align-self: flex-start; }
  .modal-backdrop { padding: 8px; }.modal { max-height: 96vh; }.modal-header { align-items: flex-start; }.modal-score { display: none; }.modal-job-actions { width: 100%; justify-content: flex-start; order: 3; margin-left: 0; padding-right: 0; }.modal-job-brand .company-logo { display: none; }.modal-job-brand h2 { font-size: 19px; padding-right: 25px; }.modal-tabs button { white-space: nowrap; }.mission-grid, .question-list, .analysis-columns, .match-skills, .company-detail-layout, .company-facts, .company-sites-list { grid-template-columns: 1fr; }.full-width { grid-column: auto; }.question-list { gap: 7px; }.interview-features { gap: 15px; }.interview-actions { gap: 10px; }.interview-actions .button { flex: 1; padding: 0 10px; font-size: 14px; }
  .small-modal.status-modal { padding: 24px 18px; }.status-modal-head { padding-right: 22px; }.status-modal-preview { align-items: flex-start; flex-direction: column; }.status-modal-preview .tag { margin-left: 0; }.status-choice { grid-template-columns: 38px minmax(0, 1fr) 20px; padding: 12px; }.status-modal-actions { flex-direction: column-reverse; }.status-modal-actions .button { width: 100%; }
  .interview-complete { padding: 35px 8px; }
  .interview-complete-actions { align-items: stretch; flex-direction: column; }
  .simulator-job-context { width: 100%; }.simulator-intro, .interviewer-profile-card, .simulator-guide { padding: 18px; }
  .simulator-guide-steps { grid-template-columns: 1fr; }
  .simulator-session-head { align-items: flex-start; gap: 12px; }.simulator-session-progress { width: 60%; grid-template-columns: 1fr; gap: 5px; }
  .interviewer-presence { padding: 14px; }.live-pill { display: none; }
  .interview-question-card { padding: 23px 17px 18px; }.interviewer-prompt { min-height: 0; font-size: 18px; }
  .qcm-option { align-items: flex-start; padding: 12px; }.qcm-option strong { font-size: 12px; }
  .simulator-reaction { margin: 0 17px 17px; }
  .simulator-dialogue-footer { align-items: stretch; flex-direction: column; }.simulator-dialogue-footer > span { display: none; }
  .satisfaction-panel { display: grid; padding: 12px; }.satisfaction-display { margin-bottom: 0; }
  #softSkillsResults { grid-template-columns: 1fr; }.simulator-results-hero { grid-template-columns: 1fr; text-align: center; }.result-score-ring { margin: 0 auto; }
  .external-review-modal { padding: 24px 16px 16px; }
  .external-review-head { gap: 11px; padding-right: 30px; }
  .external-review-head .modal-icon { flex-basis: 40px; width: 40px; height: 40px; }
  .external-review-head h2 { font-size: 20px; }
  #externalReviewPrompt { min-height: 52vh; font-size: 14px; }
  .external-review-footer { align-items: stretch; flex-direction: column; }
  .external-review-footer .button { width: 100%; }
  .watch-page-head { min-height: auto; }.watch-live-pill { display: none; }
  .announcements-search { grid-template-columns: 1fr; padding: 12px; }
  #announcements .watch-filters {
    top: 66px;
    z-index: 14;
    margin: 0 -16px 12px;
    padding: 7px 16px;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
    background: rgba(247,247,250,.97);
    box-shadow: 0 10px 24px rgba(27,24,58,.08);
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
  }
  #announcements .watch-filters.is-scroll-hidden {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);
    pointer-events: none;
  }
  .watch-filters button { min-height: 36px; padding-inline: 12px; }
  .watch-feed { gap: 13px; }
  .watch-post { border-radius: 16px; }
  .watch-post-head { padding: 13px; }.watch-source-avatar { flex-basis: 38px; width: 38px; height: 38px; }
  .watch-post-body { padding: 15px; }.watch-post-body h2 { font-size: 19px; }
  .watch-post-actions { grid-template-columns: 1fr 1fr; }.watch-post-actions a { grid-column: 1 / -1; justify-self: stretch; }
  #announcements .watch-post-image,
  #announcements .watch-resource-media {
    height: min(235px, 50vw);
    max-height: 235px;
  }
  #announcements .watch-resource-video {
    height: min(235px, 50vw);
  }
  .announcement-post .watch-post-actions {
    grid-template-columns: 44px 44px minmax(0, 1fr);
    gap: 6px;
  }
  .announcement-post .watch-post-actions a {
    grid-column: auto;
    min-width: 0;
    justify-self: stretch;
  }
  .announcement-post .watch-post-actions button[data-announcement-action="save"],
  .announcement-post .watch-post-actions button[data-announcement-action="dismiss"] {
    width: 44px;
    padding: 0;
  }
  .announcement-post .watch-post-actions button[data-announcement-action="save"] span,
  .announcement-post .watch-post-actions button[data-announcement-action="dismiss"] span {
    display: none;
  }
  .announcement-post .paid-feature-popover-wrap {
    grid-column: 1 / -1;
    justify-self: center;
    margin-top: 4px;
  }
  .announcement-post .paid-feature-popover,
  .announcement-post .paid-feature-popover-wrap:hover .paid-feature-popover,
  .announcement-post .paid-feature-popover-wrap:focus-within .paid-feature-popover {
    display: none;
  }
  .announcement-post .watch-post-actions .announcement-analyze-cta {
    justify-self: center;
  }
  .announcement-profile-gate { padding: 20px; }
  .announcement-profile-gate-head, .announcement-profile-gate-actions { flex-direction: column; }
  .announcement-profile-gate h2 { font-size: 23px; }
  .announcement-profile-gate-actions .button { width: 100%; }
  .watch-resource-actions { grid-template-columns: 1fr; }
  .watch-resource-actions .watch-resource-link { grid-column: auto; justify-self: stretch; }
  .watch-resource-context { justify-content: center; min-height: auto; padding: 2px 4px 6px; text-align: center; }
  .settings-hero { padding: 24px 18px; border-radius: 20px; }
  .settings-hero h1 { font-size: 34px; letter-spacing: -1.4px; }
  .settings-hero p { font-size: 15px; }
  .settings-card { padding: 20px; }
  .settings-card-head { align-items: flex-start; }
  .settings-account-list div { grid-template-columns: 1fr; gap: 5px; }
  .settings-rgpd summary { align-items: flex-start; padding: 18px; }
  .settings-rgpd-body { padding: 0 18px 18px; }
  .settings-rgpd-intro { flex-direction: column; }
  .settings-rgpd-box { padding: 16px; }
  .settings-rgpd-box .button { width: 100%; }
  .subscription-hero { padding: 24px 18px; border-radius: 20px; }
  .subscription-hero h1 { font-size: 34px; letter-spacing: -1.4px; }
  .subscription-hero p { font-size: 15px; }
  .subscription-layout,
  .subscription-hero,
  .subscription-current-card,
  .subscription-upgrade-card,
  .subscription-invoices-card,
  .subscription-cancel-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .subscription-current-card, .subscription-upgrade-card, .subscription-invoices-card { padding: 20px; }
  .subscription-card-head { align-items: flex-start; min-width: 0; }
  .subscription-card-head h2,
  .subscription-upgrade-card h3,
  .subscription-current-card > p,
  .subscription-upgrade-card > p {
    overflow-wrap: anywhere;
  }
  .subscription-facts div { grid-template-columns: 1fr; gap: 5px; }
  .subscription-upgrade-card .button { width: 100%; }
  .subscription-invoices-head { align-items: flex-start; flex-direction: column; }
  .subscription-table { min-width: 540px; }
  .subscription-table th, .subscription-table td { padding: 12px 13px; white-space: nowrap; }
  .subscription-pagination { align-items: stretch; flex-direction: column; }
  .subscription-pagination .button { width: 100%; }
  .subscription-cancel-card summary { align-items: flex-start; padding: 18px; }
  .subscription-cancel-body { padding: 0 18px 18px; }
  .subscription-cancel-body .button { width: 100%; }
  .help-hero { padding: 24px 18px; border-radius: 20px; }
  .help-hero h1 { font-size: 34px; letter-spacing: -1.4px; }
  .help-hero p { font-size: 15px; }
  .help-section-head { align-items: flex-start; flex-direction: column; }
  .help-section-head h2 { font-size: 24px; }
  .help-journey, .help-feature-grid { grid-template-columns: 1fr; }
  .help-step { grid-template-columns: 1fr; padding: 18px; }
  .help-plan-card, .help-limits, .help-feature-card { padding: 20px; }
  .pricing-hero { padding: 24px 18px; border-radius: 20px; }
  .pricing-hero h1 { font-size: 34px; letter-spacing: -1.4px; }
  .pricing-grid { grid-template-columns: 1fr; }
  .pricing-card { padding: 20px; }
  .pricing-card-head { min-height: 0; }
  .pricing-compare { padding: 20px; }
  .pricing-compare-head { align-items: flex-start; flex-direction: column; }
  .pricing-table-legend { justify-content: flex-start; }
  .pricing-table th, .pricing-table td { padding: 14px 15px; }
}

/* Compact job cards */
.jobs-layout .job-list-card {
  min-height: 0;
  max-height: 230px;
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr);
  align-items: start;
  gap: 13px;
  padding: 16px 18px;
  overflow: hidden;
}
.jobs-layout .job-list-card > .company-logo {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
  border-radius: 12px;
}
.jobs-layout .job-list-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 7px 16px;
}
.jobs-layout .job-list-head,
.jobs-layout .job-list-content h2,
.jobs-layout .job-list-content > p,
.jobs-layout .job-meta {
  grid-column: 1 / -1;
}
.jobs-layout .job-list-head {
  min-width: 0;
  padding-right: 42px;
  gap: 10px;
}
.jobs-layout .job-list-head .muted {
  overflow: hidden;
  max-width: 180px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.jobs-layout .job-list-content h2 {
  display: -webkit-box;
  margin: 3px 42px 0 0;
  overflow: hidden;
  font-size: 16px;
  line-height: 1.25;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.jobs-layout .job-list-content > p {
  overflow: hidden;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.35;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.jobs-layout .job-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 8px 16px;
  margin: 2px 0 1px;
  font-size: 12px;
}
.jobs-layout .job-meta span {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.jobs-layout .match-row {
  min-width: 0;
  grid-column: 1;
  margin-top: 2px;
}
.jobs-layout .match-row span {
  margin-bottom: 4px;
  font-size: 11px;
}
.jobs-layout .match-row strong {
  font-size: 15px;
}
.jobs-layout .job-card-actions {
  grid-column: 2;
  justify-content: flex-end;
  gap: 8px;
  margin: 0 38px 0 0;
  white-space: nowrap;
}
.jobs-layout .job-card-actions .text-button {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: 9px;
  font-size: 12px;
  text-decoration: none;
}
.jobs-layout .job-card-actions .job-card-action {
  color: var(--purple);
  background: var(--purple-soft);
}
.jobs-layout .job-card-actions .danger {
  color: #b75145;
  background: #fff0ec;
}
.jobs-layout .job-card-actions .job-card-action:hover,
.jobs-layout .job-card-actions .danger:hover {
  transform: translateY(-1px);
  filter: saturate(1.08);
}
.jobs-layout .bookmark {
  top: 16px;
  right: 16px;
  bottom: auto;
}

.jobs-layout.is-grid-view > div:first-child {
  grid-template-columns: repeat(auto-fill, minmax(330px, 330px));
  align-items: stretch;
  justify-content: start;
}
.jobs-layout.is-grid-view .empty-suggestion {
  grid-column: 1 / -1;
}
.jobs-layout.is-grid-view .job-list-card {
  height: 220px;
  max-height: 220px;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  padding: 13px;
}
.jobs-layout.is-grid-view .job-list-card > .company-logo {
  display: none;
}
.jobs-layout.is-grid-view .job-list-content {
  grid-template-columns: 1fr;
  align-content: start;
  min-width: 0;
  width: 100%;
  overflow: hidden;
  gap: 5px;
}
.jobs-layout.is-grid-view .job-list-head {
  padding-right: 34px;
  align-items: flex-start;
}
.jobs-layout.is-grid-view .job-list-head .muted {
  display: none;
}
.jobs-layout.is-grid-view .job-list-content h2 {
  margin: 2px 34px 0 0;
  font-size: 15px;
  line-height: 1.22;
  -webkit-line-clamp: 2;
}
.jobs-layout.is-grid-view .job-list-content > p {
  font-size: 12px;
  line-height: 1.25;
}
.jobs-layout.is-grid-view .job-meta {
  flex-wrap: nowrap;
  min-width: 0;
  width: 100%;
  overflow: hidden;
  gap: 5px 9px;
  margin: 0;
  font-size: 11px;
}
.jobs-layout.is-grid-view .job-meta span {
  flex: 1 1 0;
}
.jobs-layout.is-grid-view .match-row {
  grid-column: 1 / -1;
  margin-top: 0;
}
.jobs-layout.is-grid-view .match-row span {
  display: none;
}
.jobs-layout.is-grid-view .match-row strong {
  font-size: 14px;
}
.jobs-layout.is-grid-view .job-card-actions {
  grid-column: 1 / -1;
  justify-content: flex-start;
  min-width: 0;
  max-width: calc(100% - 34px);
  gap: 7px;
  margin: 0 34px 0 0;
}
.jobs-layout.is-grid-view .job-card-actions .text-button {
  min-height: 30px;
  padding: 0 10px;
  font-size: 11px;
}
.jobs-layout.is-grid-view .bookmark {
  top: 14px;
  right: 14px;
}

.cover-letter-notice {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 22px;
  margin-bottom: 20px;
  border-color: #ffd7b8;
  background: linear-gradient(135deg, #fff, #fff7ef);
}
.cover-letter-notice p {
  max-width: 980px;
  margin: 5px 0 0;
  color: #5b5147;
  font-size: 15px;
  line-height: 1.65;
}
.cover-letter-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  gap: 20px;
  align-items: start;
}
.cover-letter-editor,
.cover-letter-tips,
.cover-letter-analysis {
  padding: 25px;
}
.cover-letter-form {
  display: grid;
  gap: 18px;
}
.cover-letter-form textarea {
  min-height: 118px;
  background: #faf9fc;
  font-size: 14px;
}
.cover-letter-form input {
  background: #faf9fc;
  font-size: 14px;
}
.cover-letter-form textarea::placeholder,
.cover-letter-form input::placeholder {
  color: #9b97a6;
  font-size: 14px;
}
.cover-letter-sidebar {
  position: sticky;
  top: 96px;
  display: grid;
  gap: 18px;
}
.cover-letter-tips {
  overflow: hidden;
  border-color: #d9d2ff;
  background:
    radial-gradient(circle at 92% 4%, rgba(111,82,237,.14), transparent 28%),
    linear-gradient(145deg, #fff, #fbfaff);
}
.cover-letter-tips h2 {
  margin: 8px 0 10px;
  font: 850 22px var(--font-display);
  letter-spacing: -.6px;
}
.cover-letter-tips p {
  margin: 0;
  color: #5f5a70;
  font-size: 14px;
  line-height: 1.65;
}
.cover-letter-tips .check-list {
  margin-top: 16px;
}
.cover-letter-score {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin: 10px 0 8px;
  color: var(--purple);
}
.cover-letter-score strong {
  font: 900 42px/1 var(--font-display);
  letter-spacing: -1.2px;
}
.cover-letter-score span {
  color: #8a829f;
  font-size: 15px;
  font-weight: 900;
}
.cover-letter-analysis > p {
  margin: 0 0 16px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}
.cover-letter-recos {
  display: grid;
  gap: 10px;
}
.cover-letter-recos article {
  padding: 13px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: #faf9fc;
}
.cover-letter-recos strong {
  display: block;
  margin-bottom: 5px;
  color: #403b50;
  font-size: 14px;
}
.cover-letter-recos p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.55;
}

@media (max-width: 1050px) {
  .cover-letter-layout {
    grid-template-columns: 1fr;
  }
  .cover-letter-sidebar {
    position: static;
  }
}

@media (max-width: 620px) {
  .cover-letter-notice,
  .cover-letter-editor,
  .cover-letter-tips,
  .cover-letter-analysis {
    padding: 18px;
  }
  .cover-letter-notice {
    flex-direction: column;
  }
  .cover-letter-score strong {
    font-size: 34px;
  }
}

@media (max-width: 620px) {
  .jobs-layout .job-list-card {
    max-height: 230px;
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 12px;
    gap: 9px;
  }
  .jobs-layout .job-list-card > .company-logo {
    width: 38px;
    height: 38px;
    flex-basis: 38px;
    border-radius: 11px;
  }
  .jobs-layout .job-list-content {
    grid-template-columns: 1fr;
    gap: 5px;
  }
  .jobs-layout .job-list-head {
    padding-right: 36px;
  }
  .jobs-layout .job-list-head .tag {
    padding: 4px 7px;
    font-size: 10px;
  }
  .jobs-layout .job-list-content h2 {
    margin-right: 36px;
    font-size: 14px;
    line-height: 1.22;
    -webkit-line-clamp: 1;
  }
  .jobs-layout .job-list-content > p {
    font-size: 12px;
  }
  .jobs-layout .job-meta {
    gap: 5px 8px;
    font-size: 11px;
  }
  .jobs-layout .match-row {
    gap: 8px;
  }
  .jobs-layout .match-row span {
    margin-bottom: 2px;
    font-size: 10px;
  }
  .jobs-layout .match-row strong {
    font-size: 14px;
  }
  .jobs-layout .job-card-actions {
    grid-column: 1;
    justify-content: flex-start;
    gap: 8px;
    margin: 0;
  }
  .jobs-layout .job-card-actions .text-button {
    min-height: 30px;
    padding: 0 9px;
    font-size: 11px;
  }
  .jobs-layout .bookmark {
    top: 14px;
    right: 14px;
    width: 28px;
    height: 28px;
  }
  .jobs-layout.is-grid-view > div:first-child {
    grid-template-columns: 1fr;
  }
  .jobs-layout.is-grid-view .job-list-card {
    grid-template-columns: minmax(0, 1fr);
  }
  .jobs-layout.is-grid-view .job-list-content {
    grid-template-columns: 1fr;
  }
  .jobs-layout.is-grid-view .job-card-actions {
    grid-column: 1;
    margin: 0;
  }
}

@media print {
  body * { visibility: hidden; }
  #cvPreview, #cvPreview * { visibility: visible; }
  #cvPreview { position: absolute; inset: 0; width: 210mm; min-height: 297mm; padding: 18mm; margin: 0; box-shadow: none; transform: none; }
  @page { size: A4; margin: 0; }
}

@media (max-width: 900px) {
  .training-chapter,
  .training-chapter.is-reversed {
    grid-template-columns: 1fr;
  }

  .training-player-head {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
  }

  .training-player-progress {
    grid-template-columns: minmax(150px, .35fr) minmax(0, 1fr);
    gap: 14px;
  }

  .training-player-head p,
  .training-player-score span {
    display: none;
  }

  .training-chapter.is-reversed .training-chapter-media {
    order: 0;
  }

  .training-player-score {
    justify-items: end;
    text-align: right;
  }

  .training-options,
  .training-final-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .learning-view .training-player {
    --training-page-gutter: 16px;
    --training-sticky-top: 66px;
    --training-head-height: 66px;
    --training-progress-height: 44px;
    margin-right: calc(-1 * var(--training-page-gutter));
    margin-left: calc(-1 * var(--training-page-gutter));
    padding: 18px var(--training-page-gutter);
  }

  .training-player-head {
    top: var(--training-sticky-top);
    grid-template-columns: auto minmax(0, 1fr);
    margin: -18px calc(-1 * var(--training-page-gutter)) 0;
    padding: 8px var(--training-page-gutter);
  }

  .training-player-score {
    display: none;
  }

  .training-player-progress {
    top: calc(var(--training-sticky-top) + var(--training-head-height));
    grid-template-columns: 1fr;
    margin: 0 calc(-1 * var(--training-page-gutter)) 20px;
    padding: 8px var(--training-page-gutter);
  }

  .training-player-progress strong {
    display: none;
  }

  .training-player-head h1,
  .training-chapter-copy h3 {
    font-size: 23px;
  }

  .training-chapter-copy,
  .training-quiz {
    padding: 18px;
  }

  .training-chapter-media,
  .training-chapter-media img {
    min-height: 220px;
  }

  .training-actions {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .training-actions .button {
    width: 100%;
  }
}

@media (max-width: 900px) {
  .tests-hero,
  .tests-layout,
  .test-result-hero {
    grid-template-columns: 1fr;
  }

  .tests-hero img {
    justify-self: start;
  }

  .tests-catalog,
  .test-options,
  .test-review-list,
  .test-trait-grid {
    grid-template-columns: 1fr;
  }

  .tests-sidebar {
    position: static;
  }
}

@media (max-width: 620px) {
  .tests-hero,
  .test-session,
  .test-results {
    padding: 18px;
  }

  .tests-stats,
  .test-session-head {
    grid-template-columns: 1fr;
  }

  .test-progress-row {
    grid-template-columns: 1fr;
    gap: 7px;
  }

  .test-question-card,
  .test-card-body,
  .test-result-hero {
    padding: 18px;
  }

  .test-question {
    font-size: 20px;
  }

  .test-session-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .test-session-actions .button,
  .test-result-hero .button {
    width: 100%;
  }
}

/* Typographic accessibility floor */
.nav-count,
.nav-live,
.nav-badge,
.progress-mini-head,
.progress-mini a,
.user-chip small,
kbd,
.section-kicker,
.stat-card span,
.stat-card small,
.text-button,
.tag,
.muted,
.score-ring small,
.task-date span,
.stage small,
.stage strong,
.task-progress > div:first-child,
.latest-jobs-count,
.source-logo,
.latest-job-source strong,
.latest-job-source small,
.latest-job-meta,
.latest-job-link,
.chart-period,
.chart-label,
.chart-insight,
.chart-mini-legend span,
.chart-fallback,
.skill-bar-item > div:first-child,
.filter-tabs button,
.job-meta,
.match-row span,
.empty-suggestion strong,
.pipeline-donut span,
.pipeline-legend li,
.pipeline-legend li > span,
.watch-match,
.watch-profile small,
.watch-criteria span,
.watch-summary span,
.skills-summary article div span,
.save-state,
.matrix-legend,
.matrix-name,
.coverage-ring small,
.completion-ring small,
.opportunity-panel h3,
.priority-skill,
.form-section-head > span,
label,
.contract-fieldset legend,
.check-pill span,
.priority-chips button,
.large-avatar button,
.journey-score-ring small,
.journey-progress-meta,
.journey-experience-card legend,
.storage-gauge small,
.folder-select small,
.folder-inline-actions button,
.documents-folder-actions .text-button,
.document-file-card time,
.document-file-icon,
.popular-badge,
.plan-pill,
.plan-price span,
.training-number,
.training-level,
.training-meta span,
.training-tags span,
.learning-path li > span,
.learning-path strong,
.ats-badge strong,
.ats-badge small,
.cv-upload-drop small,
.cv-source-actions span,
.cv-tabs button,
.keyword-match > div:first-child,
.cv-add-experience,
.cv-experience-card legend,
.cv-experience-active,
.cv-remove-experience,
.editor-footer > span,
.preview-toolbar,
.cv-paper header > p,
.cv-paper header div,
.cv-paper section h3,
.cv-exp-head,
.cv-paper em,
.cv-skill-list span,
.modal-score > span,
.modal-score small,
.modal-tabs button,
.modal-tabs button span,
.check-list li,
.mission-grid span,
.marker-list span,
.marker-list b,
.caution ul,
.rich-list li > span,
.rich-list strong,
.company-facts dt,
.company-facts dd,
.company-map .leaflet-control-container,
.company-sites-list strong,
.company-sites-list span,
.company-list li,
.company-competitors span,
.questions-head > strong,
.interview-features span,
.interview-progress span,
.question-category,
.status-choice small,
.add-job-choice small,
.add-job-form-head > span,
.analysis-result,
.add-job-analysis-wait small,
.modal-job-actions .button,
.toast p,
.simulator-job-context span,
.simulator-job-context strong,
.simulator-intro-meta span,
.difficulty-pill,
.profile-number,
.interviewer-profile-card > strong,
.profile-meta span,
.guide-step > span,
.guide-step strong,
.guide-step small,
.simulator-session-progress > span,
.simulator-phase > span,
.simulator-phase strong,
.simulator-phase small,
.interviewer-avatar,
.interviewer-presence strong,
.interviewer-presence span,
.qcm-option > span,
.qcm-option strong,
.simulator-reaction strong,
.simulator-reaction p,
.simulator-dialogue-footer > span,
.gauge-mark,
.satisfaction-score > span:last-child,
.satisfaction-caption,
.observed-skills > span,
.live-skill,
.result-score-ring small,
.result-skill > div:first-child,
.external-review-head .section-kicker,
.external-review-footer p,
.jobs-layout .job-list-head .tag,
.jobs-layout .job-meta,
.jobs-layout .match-row span,
.jobs-layout .job-card-actions .text-button,
.jobs-layout.is-grid-view .job-meta,
.jobs-layout.is-grid-view .job-card-actions .text-button {
  font-size: 12px !important;
}

.auth-note,
.page-head p,
.auth-hero p,
.auth-form p,
.job-title-row p,
.job-list-content > p,
.job-insight p,
.task-card p,
.tip-card p,
.latest-job-content > p,
.dashboard-section-head p,
.empty-suggestion p,
.pipeline-tip p,
.watch-post-body > p,
.watch-post-location,
.watch-note,
.watch-empty p,
.opportunity-panel > p,
.profile-summary > p,
.form-section p,
.journey-score-card > p,
.journey-preview p,
.journey-experience-toolbar p,
.documents-browser-head p,
.document-file-card p,
.documents-empty p,
.pricing-hero p,
.pricing-hero-card p,
.pricing-card p,
.pricing-features li,
.formation-hero p,
.formation-hero-card p,
.training-card p,
.learning-path p,
.cv-upload-hero p,
.cv-feedback-grid p,
.cv-sync-banner p,
.cv-tab-panel > p,
.ats-tip p,
.cv-experience-toolbar p,
.cv-paper section p,
.cv-paper ul,
.modal-job-brand p,
.detail-block p,
.detail-side-card p,
.lead-block p,
.questions-head p,
.question-item span,
.interview-intro > p,
.answer-hint,
.interview-complete > p,
.small-modal > p,
.status-modal-head p:last-child,
.analysis-loading,
.add-job-section label,
.add-job-analysis-wait p,
.company-identity-head p,
.company-map-fallback,
.simulator-intro p,
.simulator-guide p,
.interviewer-profile-card > p,
.simulator-results-hero p,
.result-advice > p,
.external-review-head p,
.jobs-layout .job-list-content > p,
.jobs-layout.is-grid-view .job-list-content > p {
  font-size: 14px !important;
}

/* Keep existing readable labels from being lowered by the floor above. */
.section-kicker,
.tag,
.muted,
.match-row span,
.stage small,
.save-state,
.matrix-legend,
.coverage-ring small,
.completion-ring small,
.latest-jobs-count,
.latest-job-source strong,
.latest-job-source small,
.latest-job-meta,
.latest-job-link,
.filter-tabs button,
.plan-price span,
.learning-path strong,
.ats-badge strong,
.ats-badge small,
.cv-source-actions span,
.cv-tabs button,
.editor-footer > span,
.preview-toolbar,
.modal-score > span,
.modal-score small,
.modal-tabs button,
.modal-tabs button span,
.marker-list span,
.caution ul,
.interview-features span,
.interview-progress span,
.question-category,
.external-review-head .section-kicker {
  font-size: 13px !important;
}

.text-button,
.stat-card span,
.stat-card small,
.task-progress > div:first-child,
.skill-bar-item > div:first-child,
.job-meta,
.stage strong,
.empty-suggestion strong,
.pipeline-legend li,
.pipeline-legend li > span,
.skills-summary article div span,
.matrix-name,
.opportunity-panel h3,
.priority-skill,
.form-section-head > span,
label,
.contract-fieldset legend,
.check-pill span,
.priority-chips button,
.keyword-match > div:first-child,
.pricing-features li,
.mission-grid span,
.check-list li,
.marker-list b,
.rich-list strong,
.company-list li,
.questions-head > strong,
.question-item span,
.qcm-option strong,
.simulator-reaction strong,
.simulator-reaction p,
.satisfaction-caption,
.external-review-footer p {
  font-size: 14px !important;
}