/* Ciwei design system. Foundations → shared controls → task components → responsive states.
   Vendor/Tailwind CSS loads first; this is the single source of component appearance. */
:root {
  color-scheme: light;
  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans', sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 0.9375rem;
  --text-lg: 1rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.75rem;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --line-body: 1.6;
  --line-heading: 1.3;
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --radius-sm: 0.25rem;
  --radius-md: 0.625rem;
  --radius-lg: 1rem;
  --control-height: 2.75rem;
  --header-height: 3.75rem;
  --page-width: 80rem;
  --page-gutter: 2rem;
  --dialog-gutter: 1.5rem;
  --background-color: #ffffff;
  --background-color-2: #f4f6f4;
  --background-color-3: #f8faf8;
  --surface-chrome: #f8faf9;
  --border-subtle: #e9eeea;
  --foreground: #191d1a;
  --text-color: #343b36;
  --secondary-text-color: #626b64;
  --muted-foreground: var(--secondary-text-color);
  --border-color: #e1e6e2;
  --border-color-2: #bcc5be;
  --input-border: #858f88;
  --primary: #202722;
  --primary-foreground: #ffffff;
  --primary-hover: #354139;
  --primary-pressed: #141b17;
  --surface-hover: #f4f6f4;
  --surface-pressed: #e8eeea;
  --selected-hover: #e1f0e5;
  --selected-pressed: #d4e8da;
  --danger-hover: #fde3df;
  --danger-pressed: #fbd0ca;
  --accent: var(--background-color-2);
  --keyword-button-on-bg-color: #edf7ef;
  --keyword-button-on-text-color: #166534;
  /* Dense data fills inherit the current accent hue at reduced chroma.
     These are Ciwei display choices, not universal saturation limits. */
  --chart-accent: var(--keyword-button-on-text-color);
  --chart-ink: var(--foreground);
  --chart-low-lightness: .97;
  --chart-high-lightness: .78;
  --chart-color-strength: .32;
  --chart-bar-lightness: .58;
  --chart-bar-strength: .45;
  --selected-border: #92b99e;
  --focus-color: #166534;
  --error-text: #b42318;
  --error-bg: #fef3f2;
  --skeleton-base: #e6ebe7;
  --skeleton-shine: #f4f6f4;
  --toast-bg: #202722;
  --toast-text: #ffffff;
  --toast-error-bg: #a3281c;
  --overlay-bg-color: rgba(14, 23, 17, 0.38);
  --shadow-popover: 0 8px 28px rgba(20, 36, 25, 0.12);
  --shadow-dialog: 0 16px 64px rgba(20, 36, 25, 0.16);
  --motion-fast: 150ms;
  --motion-enter: 180ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
}
[data-theme='dark'] {
  color-scheme: dark;
  --background-color: #181c19;
  --background-color-2: #232924;
  --background-color-3: #1e241f;
  --surface-chrome: #1c231e;
  --border-subtle: #2d3730;
  --foreground: #f1f5f2;
  --text-color: #d3dbd5;
  --secondary-text-color: #acb7af;
  --border-color: #343d36;
  --border-color-2: #566159;
  --input-border: #78877d;
  --primary: #edf3ee;
  --primary-foreground: #202722;
  --primary-hover: #d6e3d9;
  --primary-pressed: #bdcec1;
  --surface-hover: #232e26;
  --surface-pressed: #303d34;
  --selected-hover: #294b34;
  --selected-pressed: #335c40;
  --danger-hover: #5b3028;
  --danger-pressed: #753b31;
  --keyword-button-on-bg-color: #203d2a;
  --keyword-button-on-text-color: #b0e4be;
  --chart-low-lightness: .25;
  --chart-high-lightness: .43;
  --chart-bar-lightness: .62;
  --selected-border: #5d8e6c;
  --focus-color: #b0e4be;
  --error-text: #ffb4ab;
  --error-bg: #462820;
  --skeleton-base: #29332b;
  --skeleton-shine: #39433b;
  --toast-bg: #edf3ee;
  --toast-text: #202722;
  --toast-error-bg: #7f241a;
  --overlay-bg-color: rgba(0, 0, 0, 0.55);
  --shadow-popover: 0 8px 28px rgba(0, 0, 0, 0.3);
  --shadow-dialog: 0 16px 64px rgba(0, 0, 0, 0.4);
}

/* Foundations and shared states. */
html {
  scroll-padding-top: calc(var(--header-height) + var(--space-4));
}
body {
  margin: 0;
  padding-top: var(--header-height);
  font-family: var(--font-family);
  font-size: var(--text-base);
  line-height: var(--line-body);
  background: var(--background-color);
  color: var(--text-color);
  overflow-wrap: anywhere;
  -webkit-text-size-adjust: 100%;
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
a {
  -webkit-tap-highlight-color: transparent;
}
a {
  color: inherit;
  text-decoration: none;
}
button {
  cursor: pointer;
}
button:disabled,
input:disabled,
select:disabled,
textarea:disabled,
[aria-disabled='true'] {
  opacity: 0.5;
  cursor: default;
}
[hidden],
.hidden {
  display: none !important;
}
:focus-visible {
  outline: 2px solid var(--focus-color);
  outline-offset: 3px;
}
.view-tab:focus-visible {
  outline-offset: -4px;
}
:is(.assistant-check, .dropdown > div):has(input:focus-visible) {
  outline: 2px solid var(--focus-color);
  outline-offset: 3px;
}
:is(.assistant-check, .dropdown > div) input:focus-visible {
  outline: none;
}
.assistant-check:has(input:disabled) {
  opacity: 0.5;
  cursor: default;
}
.assistant-check input:disabled { opacity: 1; }
input[type='checkbox'] {
  width: 16px;
  height: 16px;
  accent-color: var(--keyword-button-on-text-color);
  flex-shrink: 0;
}
::selection {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
:is(
  .assistant-primary,
  .assistant-secondary,
  .assistant-text-btn,
  .filter-btn,
  .apply-button,
  .applied-toggle,
  .error-btn,
  .consent-btn,
  .applied-archive-remove,
  .clear-filters-btn
) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  line-height: 1.4;
  transition:
    background-color var(--motion-fast),
    border-color var(--motion-fast),
    color var(--motion-fast);
}
:is(.assistant-primary, .error-btn-primary) {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--primary-foreground);
}
:is(
  .assistant-secondary,
  .filter-btn,
  .apply-button,
  .applied-toggle,
  .error-btn-secondary,
  .consent-btn,
  .applied-archive-remove
) {
  background: transparent;
  border-color: var(--border-color-2);
  color: var(--text-color);
}
:is(.assistant-text-btn, .clear-filters-btn) {
  background: transparent;
  color: var(--secondary-text-color);
}
:is(.filter-btn[aria-pressed='true'], .filter-btn.is-active, .applied-toggle[aria-pressed='true']) {
  background: var(--keyword-button-on-bg-color);
  border-color: var(--selected-border);
  color: var(--keyword-button-on-text-color);
}
:is(
  .assistant-fields input:not([type='checkbox']),
  .assistant-fields select,
  .workspace-followup input,
  .workspace-followup select,
  .workspace-followup textarea,
  .sync-body input:not([type='checkbox']),
  .saved-search-dialog input:not([type='checkbox']),
  .recommendation-feedback select,
  .insights-filter select
) {
  width: 100%;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  background: var(--background-color);
  color: var(--foreground);
  font-size: var(--text-base);
  line-height: 1.5;
  min-width: 0;
  box-sizing: border-box;
}
:is(input, textarea)::placeholder {
  color: var(--secondary-text-color);
  opacity: 1;
}
:is(.dropdown, .search-autocomplete, .lang-switcher-dropdown) {
  background: var(--background-color);
  color: var(--text-color);
  border: 1px solid var(--border-color-2);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-popover);
  z-index: 60;
}
:is(.dropdown, .search-autocomplete, .assistant-location-options, .assistant-preferences-body, .detail-content) {
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--border-color-2) transparent;
}

/* Header, page frame and task navigation. */
header {
  height: var(--header-height);
  padding-inline: var(--space-6);
  gap: var(--space-3);
  background: var(--background-color);
  color: var(--foreground);
  border-bottom: 1px solid var(--border-color);
}
.brand-link {
  border-radius: var(--radius-md);
  min-height: var(--control-height);
  gap: var(--space-2);
}
.brand-mark {
  height: 36px;
  width: auto;
}
header .icon-wrapper {
  display: grid;
  place-items: center;
  width: var(--control-height);
  height: var(--control-height);
  border-radius: var(--radius-md);
}
.brand-name {
  font-size: 18px;
  font-weight: var(--weight-semibold);
  white-space: nowrap;
}
.icon {
  color: var(--secondary-text-color);
}
.divider {
  border-color: var(--border-color);
}
.theme-toggle,
.lang-switcher-btn {
  min-height: var(--control-height);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  border: 1px solid var(--border-color-2);
  border-radius: var(--radius-md);
  background: transparent;
  color: var(--text-color);
  font-size: var(--text-sm);
}
.theme-toggle {
  width: var(--control-height);
  flex-shrink: 0;
}
.toggle-container,
.toggle-circle {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
}
.sun-icon,
.moon-icon {
  display: none;
  width: 16px;
  height: 16px;
}
.theme-toggle[data-dark='false'] .sun-icon,
.theme-toggle[data-dark='true'] .moon-icon {
  display: block;
}
.lang-switcher {
  position: relative;
}
.lang-switcher-btn {
  padding: 0 var(--space-3);
}
.lang-switcher-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + var(--space-2));
  min-width: 160px;
  padding: var(--space-1);
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
  transition:
    opacity var(--motion-fast),
    transform var(--motion-fast);
}
.lang-switcher-dropdown.open {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.lang-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  color: var(--text-color);
  text-align: left;
}
.lang-option.active {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
  font-weight: var(--weight-semibold);
}
.lang-option .check-icon {
  opacity: 0;
}
.lang-option.active .check-icon {
  opacity: 1;
}
.skip-link {
  position: fixed;
  top: var(--space-2);
  left: var(--space-4);
  max-width: calc(100vw - 32px);
  z-index: 10005;
  padding: var(--space-3) var(--space-4);
  background: var(--primary);
  color: var(--primary-foreground);
  border-radius: var(--radius-md);
  transform: translateY(-160%);
}
.skip-link:focus {
  transform: none;
}
#joblistwrapper {
  max-width: var(--page-width);
  padding: var(--space-8) var(--page-gutter) var(--space-10);
  margin-inline: auto;
}
.list-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2) var(--space-5);
  margin-bottom: var(--space-4);
}
#jobListHeading {
  font-size: var(--text-3xl);
  font-weight: var(--weight-semibold);
  line-height: var(--line-heading);
  letter-spacing: -0.025em;
  color: var(--foreground);
}
#dataUpdatedAt {
  font-size: var(--text-xs);
  color: var(--secondary-text-color);
}
#dataUpdatedAt.data-stale {
  color: var(--error-text);
}
.board-views {
  display: flex;
  gap: var(--space-6);
  border-bottom: 1px solid var(--border-color);
  margin-bottom: var(--space-5);
  position: sticky;
  top: var(--header-height);
  z-index: 40;
  background: var(--background-color);
}
.view-tab {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: 52px;
  padding: var(--space-2) 0;
  border-bottom: 2px solid transparent;
  color: var(--secondary-text-color);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  white-space: nowrap;
  transition:
    color var(--motion-fast),
    border-color var(--motion-fast);
}
.view-tab[aria-pressed='true'] {
  color: var(--foreground);
  font-weight: var(--weight-semibold);
  border-color: var(--keyword-button-on-text-color);
}
.view-count {
  padding: 2px var(--space-2);
  border-radius: var(--radius-sm);
  background: var(--background-color-2);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
}

/* Search, filters, menus and result tools. */
#joblistwrapper .joblist-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: flex-start;
}
#joblistwrapper #search-wrapper {
  flex: 1 1 340px;
  min-width: 240px;
  max-width: none;
}
#search-wrapper .dataTables_filter,
#search-wrapper label {
  display: block;
  width: 100%;
  margin: 0;
  float: none;
}
.search-wrapper {
  position: relative;
}
#search-wrapper input {
  width: 100%;
  min-width: 0;
  height: var(--control-height);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
  background: var(--background-color)
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23748078' stroke-width='2' stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='m20 20-3.5-3.5'/></svg>")
    no-repeat 12px center;
  padding: 0 var(--control-height) 0 36px;
  margin: 0;
  color: var(--foreground);
  font-size: var(--text-base);
  box-sizing: border-box;
}
#search-wrapper input:focus {
  border-color: var(--focus-color);
}
#search-wrapper input::-webkit-search-cancel-button {
  display: none;
}
.search-clear {
  position: absolute;
  right: 0;
  top: 0;
  width: var(--control-height);
  height: var(--control-height);
  border-radius: var(--radius-md);
  font-size: 22px;
  color: var(--secondary-text-color);
}
.filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.filter-group {
  position: relative;
}
.filter-btn {
  height: var(--control-height);
}
#locationFilterBtnText,
#yoeFilterBtnText {
  width: auto;
  max-width: 10rem;
}
.chevron {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: var(--secondary-text-color);
  transition: transform var(--motion-fast);
}
.filter-btn[aria-expanded='true'] .chevron {
  transform: rotate(180deg);
}
.filter-dot {
  display: none;
}
.clear-filters-btn {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.dropdown {
  position: absolute;
  top: calc(100% + var(--space-2));
  left: 0;
  width: min(280px, calc(100vw - 32px));
  min-width: 180px;
  max-height: min(380px, 55svh);
  padding: var(--space-1);
  overflow-y: auto;
}
.dropdown > div {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: var(--control-height);
  padding: 0 var(--space-3);
  border-radius: var(--radius-sm);
}
.dropdown > div:has(input:checked) {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
.dropdown > div:has(input:focus-visible) {
  outline: 2px solid var(--focus-color);
  outline-offset: -2px;
}
.dropdown label {
  flex: 1;
  padding-block: var(--space-3);
  font-size: var(--text-base);
  line-height: 1.4;
  cursor: pointer;
}
.search-autocomplete {
  position: absolute;
  top: calc(100% + var(--space-2));
  left: 0;
  right: 0;
  max-height: 360px;
  overflow-y: auto;
  padding: var(--space-1);
  display: none;
}
.search-autocomplete.open {
  display: block;
}
.search-section-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-2) var(--space-3);
  font-size: var(--text-xs);
  color: var(--secondary-text-color);
  font-weight: var(--weight-medium);
}
.search-section-label .clear-btn {
  min-height: var(--control-height);
  padding: var(--space-2);
  color: var(--text-color);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-size: var(--text-xs);
  border-radius: var(--radius-sm);
}
.search-suggestion {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  cursor: pointer;
}
.search-suggestion.active,
.search-suggestion[aria-selected='true'] {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
.suggestion-icon {
  display: grid;
  place-items: center;
  width: 18px;
  flex-shrink: 0;
  text-align: center;
  font-size: var(--text-sm);
  color: var(--secondary-text-color);
}
.suggestion-text {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.suggestion-type {
  font-size: var(--text-xs);
  color: var(--secondary-text-color);
}
.search-suggestion .remove-btn {
  width: var(--control-height);
  height: var(--control-height);
  margin: calc(-1 * var(--space-2)) calc(-1 * var(--space-2)) calc(-1 * var(--space-2)) 0;
  flex-shrink: 0;
  border-radius: var(--radius-sm);
  color: var(--secondary-text-color);
  opacity: 0.7;
}
.search-suggestion .remove-btn:focus-visible {
  opacity: 1;
  background: var(--background-color-3);
}
.search-highlight {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
  border-radius: var(--radius-sm);
}
.results-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-3) 0 var(--space-1);
}
.result-count {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: var(--text-sm);
  color: var(--secondary-text-color);
}
.result-count:empty {
  display: none;
}
.sort-control {
  min-width: 0;
  flex-shrink: 0;
}
.sort-control select {
  border: 1px solid transparent;
  min-height: var(--control-height);
  padding: var(--space-2) 28px var(--space-2) var(--space-2);
  max-width: 220px;
  border-radius: var(--radius-md);
  background: var(--background-color);
  color: var(--text-color);
  font-size: var(--text-sm);
  cursor: pointer;
}

/* Job rows, shared posting/application actions and compact data labels. */
#jobTable {
  width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  border-bottom: 0;
}
#jobTable th.col-company {
  width: 15%;
}
#jobTable th.col-job-title {
  width: 36%;
}
#jobTable th.col-yoe {
  width: 8%;
}
#jobTable th.col-salary {
  width: 12%;
}
#jobTable th.col-link {
  width: 29%;
}
#jobTable :is(th, td) {
  text-align: left;
  box-sizing: border-box;
}
#jobTable :is(.col-star, .col-job-type, .col-post-date, .col-location, .col-remote) {
  display: none;
}
#jobTable thead {
  position: sticky;
  top: calc(var(--header-height) + 52px);
  z-index: 10;
}
#jobTable thead th {
  padding: var(--space-3);
  border-bottom: 1px solid var(--border-color);
  background: var(--background-color);
  background-image: none !important;
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  cursor: default;
}
#jobTable thead th:first-child {
  padding-left: 0;
}
#jobTable tr:not(.date-separator) {
  background: transparent;
  cursor: pointer;
}
#jobTable tr:not(.date-separator) td {
  padding: var(--space-4) var(--space-3);
  border-bottom: 1px solid var(--border-subtle);
  vertical-align: middle;
  background: transparent;
  font-size: var(--text-sm);
}
#jobTable tr:not(.date-separator):has(:focus-visible) td {
  background: var(--surface-hover);
}
#jobTable tr:not(.date-separator) td:first-child {
  padding-left: 0;
}
#jobTable tr:not(.date-separator) td:last-child {
  padding-right: 0;
}
#jobTable .date-separator {
  background: transparent;
}
#jobTable .date-separator td {
  padding: var(--space-5) 0 var(--space-2);
  border: 0;
  background: transparent;
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
}
.co {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-width: 0;
}
.avatar {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: var(--radius-md);
  background: var(--background-color-2);
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  user-select: none;
}
.avatar--logo {
  overflow: hidden;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(128, 128, 128, .14);
}
.avatar--logo img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #fff;
}
.co-body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-1);
  min-width: 0;
}
.co-name {
  max-width: 100%;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  line-height: 1.5;
  color: var(--text-color);
  overflow-wrap: anywhere;
}
.job-title {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: var(--foreground);
  text-align: left;
  font-size: var(--text-lg);
  font-weight: var(--weight-semibold);
  line-height: 1.45;
  white-space: normal;
  overflow-wrap: anywhere;
}
.sub-info {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-top: var(--space-1);
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  line-height: 1.5;
  white-space: normal;
}
.tag,
.pill,
.assistant-criteria span,
.applied-archive-badge {
  display: inline-flex;
  align-items: center;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  background: var(--background-color-2);
  color: var(--text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  line-height: 1.3;
  white-space: nowrap;
}
.tag-h1b {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
.tag-type {
  border: 1px solid var(--border-color-2);
  background: transparent;
}
.type-text,
.is-unknown {
  color: var(--secondary-text-color);
}
.col-salary {
  font-weight: var(--weight-medium);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);
  flex-wrap: wrap;
}
.row-actions .apply-button {
  background: var(--surface-chrome);
  border-color: transparent;
}
.row-actions .applied-toggle:not([aria-pressed='true']) {
  border-color: transparent;
}
.apply-button {
  max-width: 100%;
  height: auto;
  min-width: 0;
  text-align: center;
}
.applied-toggle {
  white-space: nowrap;
  color: var(--secondary-text-color);
}
.status-label {
  font-size: var(--text-sm);
}
.posting-host {
  white-space: normal;
  overflow-wrap: anywhere;
}
.posting-unavailable {
  font-size: var(--text-xs);
  color: var(--secondary-text-color);
}
.dataTables_info {
  display: none;
}
body .dataTables_wrapper .dataTables_paginate {
  float: none;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-1);
  padding: var(--space-6) 0 var(--space-2);
}
body .dataTables_wrapper .dataTables_paginate .ellipsis { color: var(--secondary-text-color); }
body .dataTables_wrapper .dataTables_paginate .paginate_button[data-ciwei-page] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--control-height);
  min-height: var(--control-height);
  margin: 0;
  padding: var(--space-2) var(--space-3);
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  background: none;
  box-shadow: none;
  color: var(--text-color) !important;
  font-size: var(--text-base);
}
body .dataTables_wrapper .dataTables_paginate .paginate_button.current[data-ciwei-page] {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--primary-foreground) !important;
}
body .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:disabled {
  opacity: 0.5;
  background: none;
  border-color: transparent;
  cursor: default;
  color: var(--text-color) !important;
}
body .dataTables_wrapper .dataTables_paginate .paginate_button:focus-visible {
  outline: 2px solid var(--focus-color);
  outline-offset: 2px;
}
.local-status-note {
  margin-top: var(--space-5);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  line-height: var(--line-body);
}

/* Goal entry and recommendations. */
#assistantPanel {
  scroll-margin-top: var(--space-12);
}
.assistant-intro {
  max-width: 640px;
  margin: var(--space-8) auto var(--space-10);
}
.assistant-intro h2 {
  font-size: var(--text-2xl);
  font-weight: var(--weight-semibold);
  line-height: var(--line-heading);
  letter-spacing: -0.02em;
  color: var(--foreground);
}
.assistant-intro > .assistant-hint {
  margin: var(--space-2) 0 var(--space-5);
  font-size: var(--text-base);
}
.assistant-intro > .assistant-hint:last-child {
  margin: var(--space-3) 0 0;
  font-size: var(--text-xs);
}
.assistant-composer {
  padding: var(--space-3);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-lg);
  background: var(--background-color);
}
.assistant-composer:focus-within {
  border-color: var(--focus-color);
}
#assistantGoal {
  width: 100%;
  min-height: 88px;
  resize: vertical;
  padding: var(--space-1);
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--foreground);
  font-size: var(--text-lg);
  line-height: var(--line-body);
}
.assistant-composer .assistant-primary {
  display: flex;
  width: 100%;
  justify-content: space-between;
  margin-top: var(--space-2);
}
.assistant-examples {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
  margin: var(--space-3) 0;
}
.assistant-examples > span {
  font-size: var(--text-xs);
  color: var(--secondary-text-color);
}
.assistant-examples button {
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--border-color-2);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  color: var(--text-color);
  text-align: left;
}
#assistantEditProfile {
  margin-left: calc(-1 * var(--space-3));
}
.assistant-about {
  border-top: 1px solid var(--border-color);
  margin-top: var(--space-6);
}
.assistant-about > summary {
  padding: var(--space-3) 0;
  min-height: var(--control-height);
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  cursor: pointer;
}
.assistant-about p {
  max-width: 70ch;
}
.assistant-method,
.assistant-hint {
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
.assistant-method {
  margin-bottom: var(--space-3);
}
.assistant-status {
  margin: var(--space-3) 0;
  color: var(--text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
.assistant-status:empty,
.assistant-status[data-state='matched'] {
  display: none;
}
.assistant-status:is([data-state='unrecognized'], [data-state='invalidYears'], [data-state='salaryNotUsed']) {
  padding-left: var(--space-3);
  border-left: 2px solid var(--input-border);
}
.assistant-goal-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--border-color);
}
.assistant-goal-summary > div {
  min-width: 0;
}
.assistant-goal-summary > button {
  flex-shrink: 0;
}
.assistant-goal-label {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
}
#assistantPersistence {
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
}
.assistant-criteria,
.assistant-extra-criteria > div {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.assistant-criteria span {
  white-space: normal;
  overflow-wrap: anywhere;
}
.assistant-extra-criteria summary {
  min-height: var(--control-height);
  padding: var(--space-2);
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  cursor: pointer;
}
.assistant-extra-criteria[open] {
  width: 100%;
}
.assistant-extra-criteria > div {
  margin-top: var(--space-2);
}
.assistant-results-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
  padding: var(--space-5) 0 var(--space-1);
}
.assistant-results-heading h2 {
  color: var(--foreground);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
}
.assistant-result-list {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-4);
}
.assistant-result {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) 0;
  border-bottom: 1px solid var(--border-color);
}
.assistant-result-body {
  min-width: 0;
}
.assistant-company {
  font-size: var(--text-sm);
  color: var(--secondary-text-color);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.assistant-result h4 {
  margin: var(--space-1) 0 var(--space-2);
}
.assistant-result-meta {
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
  overflow-wrap: anywhere;
}
.assistant-reasons {
  margin-top: var(--space-2);
  color: var(--text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
.assistant-confirm {
  margin-top: var(--space-2);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  line-height: var(--line-body);
  overflow-wrap: anywhere;
}
.assistant-confirm > span {
  margin-right: var(--space-2);
  font-weight: var(--weight-medium);
}
.assistant-result .row-actions {
  max-width: 300px;
}
.assistant-no-results {
  padding: var(--space-12) 0;
}
.assistant-no-results h3 {
  font-size: var(--text-xl);
  font-weight: var(--weight-semibold);
  margin-bottom: var(--space-3);
}
.assistant-no-results p {
  max-width: 45ch;
  color: var(--secondary-text-color);
  font-size: var(--text-base);
  line-height: var(--line-body);
}

/* Goal editor: native dialog, one field system, one persistent action footer. */
body.preferences-open,
body.details-open {
  overflow: hidden;
}
.assistant-preferences {
  width: min(640px, calc(100vw - 40px));
  max-width: none;
  max-height: min(850px, calc(100dvh - 64px));
  margin: auto;
  padding: 0;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--background-color);
  color: var(--text-color);
  box-shadow: var(--shadow-dialog);
}
.assistant-preferences[open] {
  display: flex;
  flex-direction: column;
  animation: preferences-enter var(--motion-enter) var(--ease-out);
}
:is(.assistant-preferences, .job-details)::backdrop {
  background: var(--overlay-bg-color);
}
.assistant-preferences-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  padding: var(--space-4) var(--space-6);
  border-bottom: 1px solid var(--border-color);
  flex-shrink: 0;
}
.assistant-preferences-header h2 {
  color: var(--foreground);
  font-size: var(--text-xl);
  font-weight: var(--weight-semibold);
  line-height: var(--line-heading);
}
.detail-close {
  width: var(--control-height);
  height: var(--control-height);
  flex-shrink: 0;
  display: grid;
  place-items: center;
  border-radius: var(--radius-md);
  color: var(--secondary-text-color);
  font-size: 20px;
}
.assistant-preferences-body {
  min-height: 0;
  overflow-y: auto;
  padding: var(--space-6);
}
.assistant-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6) var(--space-5);
}
.assistant-fields fieldset,
.assistant-fields > .assistant-checkboxes {
  grid-column: 1 / -1;
  min-width: 0;
}
.assistant-fields legend {
  color: var(--foreground);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  margin-bottom: var(--space-3);
}
.assistant-field-pair {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
}
.assistant-field {
  min-width: 0;
}
.assistant-label,
.assistant-field > span:first-child,
.assistant-field-pair label > span {
  display: block;
  color: var(--foreground);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  margin-bottom: var(--space-2);
}
.assistant-field-hint {
  display: block;
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
  line-height: 1.5;
  margin-top: var(--space-2);
}
.assistant-checkboxes {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.assistant-check {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: var(--control-height);
  font-size: var(--text-sm);
  line-height: 1.5;
  cursor: pointer;
}
.assistant-role-options .assistant-check {
  position: relative;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--border-color-2);
  border-radius: var(--radius-md);
}
.assistant-role-options .assistant-check:has(input:checked) {
  background: var(--keyword-button-on-bg-color);
  border-color: var(--selected-border);
  color: var(--keyword-button-on-text-color);
}
.assistant-role-options input {
  margin: 0;
}
.assistant-role-options label:has(input:focus-visible) {
  outline-offset: 3px;
  border-radius: var(--radius-md);
}
.assistant-location-picker {
  padding: 0 var(--space-3);
  border: 1px solid var(--input-border);
  border-radius: var(--radius-md);
}
.assistant-location-picker > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: var(--control-height);
  font-size: var(--text-base);
  cursor: pointer;
}
.assistant-location-picker > summary::after {
  content: '';
  width: 6px;
  height: 6px;
  margin-right: 3px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg);
  flex-shrink: 0;
}
.assistant-location-picker[open] > summary::after {
  transform: rotate(225deg);
}
.assistant-location-picker > summary > span:first-child {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#assistantLocationCount {
  flex-shrink: 0;
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
}
.assistant-location-picker[open] {
  padding-bottom: var(--space-2);
}
.assistant-location-picker input[type='search'] {
  margin: var(--space-1) 0 var(--space-2);
}
.assistant-location-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 var(--space-3);
  max-height: 220px;
  overflow-y: auto;
}
.assistant-location-options .assistant-check {
  min-width: 0;
  padding: var(--space-2) 0;
}
.assistant-advanced,
.assistant-rephrase {
  border-top: 1px solid var(--border-color);
  margin-top: var(--space-6);
}
.assistant-advanced > summary,
.assistant-rephrase > summary {
  min-height: var(--control-height);
  padding: var(--space-3) 0;
  color: var(--text-color);
  font-size: var(--text-base);
  cursor: pointer;
}
.assistant-advanced .assistant-fields {
  padding: var(--space-3) 0 var(--space-1);
}
.assistant-rephrase .assistant-composer {
  margin: var(--space-3) 0;
}
.assistant-preferences .assistant-composer .assistant-primary,
.assistant-preferences .assistant-examples {
  display: none;
}
.assistant-save-choice {
  width: 100%;
  border-top: 1px solid var(--border-color);
  padding-top: var(--space-4);
  margin-top: var(--space-6);
  color: var(--text-color);
}
#assistantPreferencesStatus {
  margin-top: var(--space-4);
  color: var(--error-text);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
#assistantPreferencesStatus:empty {
  display: none;
}
.assistant-preferences-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-6);
  border-top: 1px solid var(--border-color);
  background: var(--background-color);
  flex-shrink: 0;
}
.assistant-preferences-footer > div {
  display: flex;
  gap: var(--space-2);
  flex-shrink: 0;
}
@keyframes preferences-enter {
  from {
    opacity: 0.4;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

/* Job detail drawer and application preparation. */
.job-details {
  width: min(560px, 100%);
  max-width: 100%;
  height: 100dvh;
  max-height: 100dvh;
  inset: 0 0 0 auto;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid var(--border-color);
  background: var(--background-color);
  color: var(--text-color);
  box-shadow: var(--shadow-dialog);
}
.job-details[open] {
  display: flex;
  flex-direction: column;
  animation: detail-enter var(--motion-enter) var(--ease-out);
}
@keyframes detail-enter {
  from {
    opacity: 0.4;
    transform: translateX(24px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}
.detail-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-6);
  border-bottom: 1px solid var(--border-color);
  flex-shrink: 0;
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
}
.detail-content {
  padding: var(--space-6);
  min-height: 0;
  overflow-y: auto;
  flex: 1;
}
.detail-company {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  color: var(--text-color);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
}
#detailTitle {
  margin-top: var(--space-5);
  color: var(--foreground);
  font-size: var(--text-2xl);
  font-weight: var(--weight-semibold);
  line-height: var(--line-heading);
  letter-spacing: -0.02em;
}
.detail-location {
  margin-top: var(--space-3);
  font-size: var(--text-base);
  line-height: var(--line-body);
}
.detail-date {
  margin-top: var(--space-2);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
}
.detail-facts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-5);
  margin-top: var(--space-6);
  padding: var(--space-5) 0;
  border-block: 1px solid var(--border-color);
}
.detail-facts > div {
  min-width: 0;
}
.detail-facts dt {
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
}
.detail-facts dd {
  margin-top: var(--space-1);
  color: var(--foreground);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
}
.detail-facts p {
  margin-top: var(--space-2);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  line-height: 1.5;
}
.detail-sponsorship {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-top: var(--space-5);
}
.detail-sponsorship .tag {
  flex-shrink: 0;
}
.detail-sponsorship p {
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
.detail-section {
  margin-top: var(--space-6);
}
.detail-section h3 {
  margin-bottom: var(--space-3);
  color: var(--foreground);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
}
.detail-section > p {
  font-size: var(--text-base);
  line-height: 1.8;
}
.detail-skills {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.detail-skills > span {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-sm);
  background: var(--background-color-2);
  color: var(--text-color);
  font-size: var(--text-sm);
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.detail-skills > .detail-skill-match {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
.detail-note {
  margin-top: var(--space-6);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  line-height: var(--line-body);
}
.detail-actions {
  padding: var(--space-4) var(--space-6) max(var(--space-4), env(safe-area-inset-bottom));
  border-top: 1px solid var(--border-color);
  background: var(--background-color);
  flex-shrink: 0;
}
.detail-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.detail-buttons .apply-button {
  background: var(--primary);
  border-color: var(--primary);
  color: var(--primary-foreground);
}
.detail-actions > p {
  margin-top: var(--space-3);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  line-height: 1.5;
}
.assistant-analysis {
  padding-top: var(--space-6);
  border-top: 1px solid var(--border-color);
}
.assistant-analysis-block {
  padding: var(--space-3) 0;
}
.assistant-analysis h4,
.assistant-analysis summary {
  color: var(--foreground);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
}
.assistant-analysis h4 {
  margin-bottom: var(--space-2);
}
.assistant-analysis details > summary {
  min-height: var(--control-height);
  padding: var(--space-3) 0;
  cursor: pointer;
}
.assistant-analysis :is(p, ul, ol) {
  font-size: var(--text-base);
  line-height: var(--line-body);
}
.assistant-analysis ul {
  list-style: disc;
  padding-left: var(--space-5);
}
.assistant-analysis ol {
  list-style: decimal;
  padding-left: var(--space-5);
}
.assistant-analysis li {
  margin: var(--space-2) 0;
  overflow-wrap: anywhere;
}
.assistant-analysis .detail-note {
  font-size: var(--text-xs);
  margin-top: var(--space-3);
}
.assistant-preparation {
  border-top: 1px solid var(--border-color);
}
.assistant-checklist li {
  padding: var(--space-1) 0 var(--space-2) var(--space-1);
}
.assistant-analysis .assistant-secondary {
  margin-top: var(--space-3);
}

/* Saved jobs, comparison and local follow-up share the job detail controls. */
.workspace-inline-actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2); }
.workspace-detail-toolbar { margin-top:var(--space-4); }
.workspace-tools > details { border-top:1px solid var(--border-color); margin-top:var(--space-4); padding-top:var(--space-3); }
.workspace-tools summary { min-height:var(--control-height); cursor:pointer; font-weight:var(--weight-medium); color:var(--foreground); }
.workspace-tools details > p { margin:var(--space-2) 0 var(--space-4); }
.workspace-skill-group { margin-bottom:var(--space-3); }
.workspace-preparation { margin:var(--space-4) 0; }
.workspace-preparation h4 { color:var(--foreground); font-weight:var(--weight-semibold); margin-bottom:var(--space-2); }
.workspace-preparation p { white-space:pre-line; line-height:var(--line-body); }
.workspace-skill-group h4 { font-size:var(--text-sm); font-weight:var(--weight-semibold); color:var(--foreground); }
.workspace-skill-group p { margin-top:var(--space-1); line-height:var(--line-body); }
:is(.workspace-inline-actions, .workspace-list) [aria-pressed='true'] { color:var(--keyword-button-on-text-color); border-color:var(--selected-border); background:var(--keyword-button-on-bg-color); }
.workspace-followup { display:grid; gap:var(--space-4); }
.workspace-followup label { display:grid; gap:var(--space-2); font-size:var(--text-sm); }

.workspace-followup textarea { resize:vertical; }
.workspace-dialog { width:min(70rem,calc(100vw - 3rem)); max-width:none; height:min(52rem,calc(100dvh - 3rem)); max-height:none; margin:auto; padding:0; border:1px solid var(--border-color); border-radius:var(--radius-lg); background:var(--background-color); color:var(--text-color); box-shadow:var(--shadow-dialog); }
.workspace-dialog[open] { display:flex; flex-direction:column; animation:preferences-enter var(--motion-enter) var(--ease-out); }
.workspace-dialog::backdrop { background:var(--overlay-bg-color); }
body.workspace-open { overflow:hidden; }
.workspace-header { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:var(--space-4); padding:var(--space-4) var(--space-6); border-bottom:1px solid var(--border-color); }
.workspace-header h2 { font-size:var(--text-xl); font-weight:var(--weight-semibold); color:var(--foreground); }
#workspaceTabs { position:static; flex-shrink:0; margin:0; padding:0 var(--space-6); overflow-x:auto; gap:var(--space-5); }
#workspaceContent { min-height:0; flex:1; overflow:auto; padding:var(--space-5) var(--space-6); }
#workspaceContent:has(> .workspace-empty) { display:flex; }
.workspace-empty {
  display:flex; flex:1; flex-direction:column; align-items:center; justify-content:center;
  gap:var(--space-3); padding:var(--space-8) var(--space-4); text-align:center;
  color:var(--secondary-text-color);
}
.workspace-empty h3 { color:var(--foreground); font-size:var(--text-xl); font-weight:var(--weight-semibold); line-height:var(--line-heading); }
.workspace-empty p { max-width:46ch; font-size:var(--text-base); line-height:var(--line-body); }
.workspace-empty .assistant-primary { margin-top:var(--space-2); }
.workspace-dialog:has(.workspace-empty) .workspace-footer > :is(.workspace-inline-actions, .detail-note) { display:none; }
@media (min-width:641px) { .workspace-dialog[data-empty='true'] { height:min(36rem,calc(100dvh - 3rem)); } }
.workspace-list { list-style:none; padding:0; }
.workspace-list li { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-5); padding:var(--space-5) 0; border-bottom:1px solid var(--border-color); }
.workspace-list li > div { min-width:0; }
.workspace-list p { margin-top:var(--space-1); overflow-wrap:anywhere; }
.workspace-list .assistant-secondary { flex-shrink:0; }
.workspace-footer { flex-shrink:0; padding:var(--space-4) var(--space-6); border-top:1px solid var(--border-color); }
.workspace-footer .detail-note { margin:var(--space-3) 0 0; }
.workspace-footer details { margin-top:var(--space-2); font-size:var(--text-xs); color:var(--secondary-text-color); }
.workspace-footer summary { cursor:pointer; }
.workspace-footer a { text-decoration:underline; }
.workspace-table-scroll { overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; scrollbar-color:var(--border-color-2) transparent; }
.workspace-compare { width:100%; min-width:40rem; table-layout:fixed; border-collapse:collapse; }
.workspace-compare :is(th,td) { text-align:left; vertical-align:top; border-bottom:1px solid var(--border-color); padding:var(--space-4) var(--space-3); overflow-wrap:anywhere; line-height:var(--line-body); }
.workspace-compare th { color:var(--foreground); font-weight:var(--weight-medium); }
.workspace-compare tr > :first-child { width:8rem; }
.workspace-compare thead th > span { display:block; font-size:var(--text-xs); color:var(--secondary-text-color); margin-bottom:var(--space-2); }
.workspace-compare .assistant-text-btn { display:block; margin-top:var(--space-2); }
@media (max-width:640px) {
  #joblistwrapper > .board-views { gap:var(--space-4); flex-wrap:wrap; }
  .workspace-dialog { width:100vw; height:100dvh; border:0; border-radius:0; }
  .workspace-header, .workspace-footer { padding:var(--space-4); }
  #workspaceTabs { padding:0 var(--space-4); }
  #workspaceContent { padding:var(--space-4); }
  .workspace-followup :is(input,textarea,select) { font-size:16px; }
}

/* Application archives use the same row/action grammar as current jobs. */
.applied-archive {
  margin-top: var(--space-8);
  padding-top: var(--space-5);
  border-top: 1px solid var(--border-color);
}
.applied-archive h3 {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  color: var(--foreground);
  font-size: var(--text-lg);
  font-weight: var(--weight-semibold);
}
.applied-archive-hint {
  max-width: 62ch;
  margin-top: var(--space-2);
  color: var(--secondary-text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
.applied-archive-list {
  list-style: none;
  padding: 0;
  margin: var(--space-3) 0 0;
}
.applied-archive-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  border-top: 1px solid var(--border-color);
}
.applied-archive-item:first-child {
  border-top: 0;
}
.applied-archive-main {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  min-width: 0;
}
.applied-archive-main .co-name {
  color: var(--secondary-text-color);
}
.applied-archive-title {
  color: var(--foreground);
  font-size: var(--text-lg);
  font-weight: var(--weight-medium);
  overflow-wrap: anywhere;
}
.applied-archive-title.is-unavailable {
  color: var(--secondary-text-color);
  font-size: var(--text-base);
}
.applied-archive-meta {
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  overflow-wrap: anywhere;
}
.applied-archive-badge {
  margin-right: var(--space-1);
}
.applied-archive-link {
  display: inline-flex;
  align-items: center;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border-radius: var(--radius-md);
  font-size: var(--text-sm);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Loading, empty/error states, toast feedback and consent. */
#jobTable .dataTables_empty,
#jobTable tr:has(.dataTables_empty),
#jobTable.is-empty thead {
  display: none;
}
#jobBrowseContent:has(#jobTable.is-empty) .dataTables_paginate {
  display: none;
}
#jobBrowseContent:has(#appliedArchive:not([hidden])) #jobTable.is-empty {
  border-bottom: 0;
}
.empty-state,
.error-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-12) var(--space-6);
  text-align: center;
}
.empty-state-title,
.error-state-title {
  color: var(--foreground);
  font-size: var(--text-xl);
  font-weight: var(--weight-semibold);
  line-height: var(--line-heading);
}
.empty-state-hint,
.error-state-message {
  max-width: 45ch;
  margin-bottom: var(--space-3);
  color: var(--secondary-text-color);
  font-size: var(--text-base);
  line-height: var(--line-body);
}
#jobBrowseContent:has(#appliedArchive:not([hidden])) .empty-state {
  align-items: flex-start;
  padding: var(--space-5) 0;
  text-align: left;
}
#jobBrowseContent:has(#appliedArchive:not([hidden])) .empty-state-title {
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
}
#jobBrowseContent:has(#appliedArchive:not([hidden])) .empty-state-hint {
  margin: 0;
}
#jobBrowseContent:has(#appliedArchive:not([hidden])) .empty-state button {
  display: none;
}
.error-state {
  min-height: 300px;
}
#joblistwrapper[data-load-state='error'] :is(.joblist-toolbar, .results-bar) {
  display: none;
}
.error-state-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--error-bg);
  color: var(--error-text);
  font-size: 24px;
  margin-bottom: var(--space-2);
}
.error-state-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-2);
}
.skeleton {
  display: block;
  border-radius: var(--radius-sm);
  background: var(--skeleton-base);
}
.skeleton-row {
  animation: skeleton-pulse 1.6s ease-in-out infinite alternate;
}
.skeleton-text {
  height: 14px;
}
.skeleton-badge {
  display: inline-block;
  width: 60px;
  height: 24px;
}
.skeleton-btn {
  display: inline-block;
  width: 88px;
  height: var(--control-height);
  border-radius: var(--radius-md);
}
@keyframes skeleton-pulse {
  from {
    opacity: 0.55;
  }
  to {
    opacity: 1;
  }
}
#toast-container {
  position: fixed;
  bottom: var(--space-6);
  right: var(--space-6);
  max-width: calc(100vw - 32px);
  z-index: 10000;
  display: flex;
  flex-direction: column-reverse;
  gap: var(--space-2);
  pointer-events: none;
}
.toast {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  max-width: 420px;
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--toast-bg);
  color: var(--toast-text);
  box-shadow: var(--shadow-popover);
  font-size: var(--text-base);
  line-height: 1.5;
  pointer-events: auto;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity var(--motion-enter),
    transform var(--motion-enter);
}
.toast.show,
.toast:focus-within {
  opacity: 1;
  transform: none;
}
.toast.hide {
  opacity: 0;
  transform: translateY(12px);
}
.toast.toast-error {
  background: var(--toast-error-bg);
  color: #ffffff;
}
.toast-icon {
  flex-shrink: 0;
  font-size: var(--text-lg);
}
.toast > span:not(.toast-icon) {
  min-width: 0;
}
.toast-action {
  flex-shrink: 0;
  min-height: var(--control-height);
  padding: var(--space-2) var(--space-3);
  border: 1px solid currentColor;
  border-radius: var(--radius-md);
  color: inherit;
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
}
.toast-action:focus-visible {
  outline-color: currentColor;
}
.job-details #toast-container {
  inset: 80px var(--space-4) auto;
}
.consent-banner {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-6) max(var(--space-4), env(safe-area-inset-bottom));
  border-top: 1px solid var(--border-color);
  background: var(--background-color);
  transform: translateY(100%);
  transition: transform var(--motion-enter) var(--ease-out);
}
.consent-banner.show {
  transform: none;
}
.consent-banner-text {
  flex: 1;
  color: var(--text-color);
  font-size: var(--text-sm);
  line-height: var(--line-body);
}
.consent-banner-actions {
  display: flex;
  gap: var(--space-2);
  flex-shrink: 0;
}
/* Consent is a preference: both choices have equal emphasis. */
.site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  height: auto;
  min-height: 64px;
  max-width: var(--page-width);
  margin-inline: auto;
  padding: var(--space-4) var(--page-gutter);
  color: var(--secondary-text-color);
  font-size: var(--text-xs);
  font-weight: var(--weight-regular);
}
.footer-link {
  display: inline-flex;
  align-items: center;
  min-height: var(--control-height);
  padding-inline: var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-sm);
}

.filter-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  min-height: var(--control-height);
  max-width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--selected-border);
  border-radius: var(--radius-md);
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
  font-size: var(--text-sm);
  line-height: 1.4;
  text-align: left;
  overflow-wrap: anywhere;
  transition: border-color var(--motion-fast), background-color var(--motion-fast);
}

/* Persistent app chrome shares one quiet surface; content stays unboxed. */
header,
.detail-topbar,
.detail-actions,
.workspace-header,
.workspace-footer,
.assistant-preferences-header,
.assistant-preferences-footer {
  background: var(--surface-chrome);
}

/* Interaction priority: hover → persistent selection → press. Focus stays independent.
   No geometry changes; hover is exclusive to precise pointing devices. */
:is(.assistant-primary, .assistant-secondary, .assistant-text-btn, .filter-btn, .filter-chip, .apply-button, .applied-toggle, .error-btn, .consent-btn, .applied-archive-remove, .clear-filters-btn, .theme-toggle, .lang-switcher-btn, .lang-option, .detail-close, .search-clear, .assistant-examples button, .search-section-label .clear-btn, .search-suggestion .remove-btn, header .icon-wrapper, .brand-link, .applied-archive-link, .footer-link),
.view-tab,
.search-suggestion,
:is(.assistant-about, .assistant-extra-criteria, .assistant-advanced, .assistant-rephrase, .assistant-analysis details, .workspace-tools, .workspace-footer, .sync-body details) > summary {
  transition: background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast);
}
:is(.assistant-about, .assistant-extra-criteria, .assistant-advanced, .assistant-rephrase, .assistant-analysis details, .workspace-tools, .workspace-footer, .sync-body details) > summary { border-radius: var(--radius-sm); }
.assistant-check { border-radius: var(--radius-md); }
.assistant-check:has(input:checked) {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
.view-tab[aria-pressed='true'] .view-count {
  background: var(--keyword-button-on-bg-color);
  color: var(--keyword-button-on-text-color);
}
:is(input:not([type='checkbox']), textarea, select):not(:disabled):focus {
  border-color: var(--focus-color);
}
@media (hover: hover) and (pointer: fine) {
  :is(.assistant-secondary, .assistant-text-btn, .filter-btn, .apply-button, .applied-toggle, .error-btn-secondary, .consent-btn, .applied-archive-remove, .clear-filters-btn, .theme-toggle, .lang-switcher-btn, .lang-option, .detail-close, .search-clear, .assistant-examples button, .search-section-label .clear-btn, .search-suggestion .remove-btn, header .icon-wrapper, .brand-link, .applied-archive-link, .footer-link):not(:disabled):not([aria-disabled='true']):hover,
  :is(.assistant-about, .assistant-extra-criteria, .assistant-advanced, .assistant-rephrase, .assistant-analysis details, .workspace-tools, .workspace-footer, .sync-body details) > summary:hover {
    background: var(--surface-hover);
    color: var(--foreground);
  }
  :is(.assistant-secondary, .filter-btn, .apply-button, .applied-toggle, .error-btn-secondary, .consent-btn, .applied-archive-remove, .theme-toggle, .lang-switcher-btn, .assistant-examples button):not(:disabled):not([aria-disabled='true']):hover {
    border-color: var(--input-border);
  }
  :is(.assistant-primary, .error-btn-primary, .detail-buttons .apply-button):not(:disabled):not([aria-disabled='true']):hover {
    background: var(--primary-hover);
    border-color: var(--primary-hover);
    color: var(--primary-foreground);
  }
  :is(.filter-btn[aria-pressed='true'], .filter-btn.is-active, .applied-toggle[aria-pressed='true'], :is(.workspace-inline-actions, .workspace-list) [aria-pressed='true'], .filter-chip, .lang-option.active, .assistant-check:has(input:checked)):not(:disabled):not(:has(input:disabled)):hover {
    background: var(--selected-hover);
    color: var(--keyword-button-on-text-color);
    border-color: var(--keyword-button-on-text-color);
  }
  .assistant-check:not(:has(input:disabled)):hover {
    background: var(--surface-hover);
    border-color: var(--input-border);
  }
  .assistant-check:has(input:checked):not(:has(input:disabled)):hover { background: var(--selected-hover); }
  :is(input:not([type='checkbox']), textarea, select):not(:disabled):not(:focus):hover,
  #search-wrapper input:not(:disabled):not(:focus):hover { border-color: var(--foreground); }
  .view-tab:not(:disabled):hover {
    color: var(--foreground);
    border-color: var(--border-color-2);
  }
  .view-tab[aria-pressed='true']:hover { border-color: var(--keyword-button-on-text-color); }
  .dropdown > div:not(:has(input:disabled)):hover,
  .search-suggestion:hover { background: var(--surface-hover); }
  .dropdown > div:has(input:checked):hover,
  .search-suggestion:is(.active, [aria-selected='true']):hover { background: var(--selected-hover); }
  .search-suggestion .remove-btn:hover { opacity: 1; }
  .sort-control select:not(:disabled):hover { background: var(--surface-hover); }
  .job-title:not(:disabled):hover { text-decoration: underline; text-underline-offset: 3px; }
  :is(.footer-link, .applied-archive-link):hover { text-decoration: underline; text-underline-offset: 3px; }
  #jobTable tr:not(.date-separator):hover td { background: var(--surface-hover); }
  .assistant-result:hover { background: var(--background-color-3); }
  body .dataTables_wrapper .dataTables_paginate .paginate_button:not(.disabled):hover {
    background: var(--surface-hover);
    border-color: var(--border-color-2);
    color: var(--text-color) !important;
  }
  body .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--primary-hover);
    border-color: var(--primary-hover);
    color: var(--primary-foreground) !important;
  }
  .toast-action:not(:disabled):hover { background: rgba(128, 128, 128, 0.15); }
  #syncDeleteConfirmButton:not(:disabled):hover { background: var(--danger-hover); }
}
:is(.assistant-secondary, .assistant-text-btn, .filter-btn, .apply-button, .applied-toggle, .error-btn-secondary, .consent-btn, .applied-archive-remove, .clear-filters-btn, .theme-toggle, .lang-switcher-btn, .lang-option, .detail-close, .search-clear, .assistant-examples button, .search-section-label .clear-btn, .search-suggestion .remove-btn, header .icon-wrapper, .brand-link, .applied-archive-link, .footer-link):not(:disabled):not([aria-disabled='true']):active,
.view-tab:not(:disabled):active,
.search-suggestion:active,
.assistant-check:not(:has(input:disabled)):active,
.dropdown > div:not(:has(input:disabled)):active,
:is(.assistant-about, .assistant-extra-criteria, .assistant-advanced, .assistant-rephrase, .assistant-analysis details, .workspace-tools, .workspace-footer, .sync-body details) > summary:active {
  background: var(--surface-pressed);
  color: var(--foreground);
  transition-duration: 0ms;
}
:is(.assistant-primary, .error-btn-primary, .detail-buttons .apply-button):not(:disabled):not([aria-disabled='true']):active {
  background: var(--primary-pressed);
  border-color: var(--primary-pressed);
  color: var(--primary-foreground);
  transition-duration: 0ms;
}
:is(.filter-btn[aria-pressed='true'], .filter-btn.is-active, .applied-toggle[aria-pressed='true'], :is(.workspace-inline-actions, .workspace-list) [aria-pressed='true'], .filter-chip, .lang-option.active, .assistant-check:has(input:checked)):not(:disabled):not(:has(input:disabled)):active,
.dropdown > div:has(input:checked):active,
.search-suggestion:is(.active, [aria-selected='true']):active,
.view-tab[aria-pressed='true']:active {
  background: var(--selected-pressed);
  color: var(--keyword-button-on-text-color);
  border-color: var(--keyword-button-on-text-color);
  transition-duration: 0ms;
}
body .dataTables_wrapper .dataTables_paginate .paginate_button:not(.disabled):active {
  background: var(--surface-pressed);
  box-shadow: none;
}
body .dataTables_wrapper .dataTables_paginate .paginate_button.current:active { background: var(--primary-pressed); }
.toast-action:not(:disabled):active { background: rgba(128, 128, 128, 0.28); }
#syncDeleteConfirmButton:not(:disabled):active { background: var(--danger-pressed); }

.job-title:not(:disabled):active {
  color: var(--keyword-button-on-text-color);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Responsive behavior is grouped once, after the component definitions. */
@media (min-width: 769px) {
  .row-actions .posting-verb {
    display: none;
  }
}
@media (min-width: 769px) and (max-width: 1100px) {
  #jobTable th.col-company {
    width: 18%;
  }
  #jobTable th.col-job-title {
    width: 28%;
  }
  #jobTable th.col-yoe {
    width: 10%;
  }
  #jobTable th.col-salary {
    width: 14%;
  }
  #jobTable th.col-link {
    width: 30%;
  }
  #jobTable tr:not(.date-separator) td {
    padding-inline: var(--space-2);
  }
}
@media (max-width: 768px) {
  :root {
    --page-gutter: 1rem;
  }
  header {
    padding-inline: var(--page-gutter);
  }
  header .icon-wrapper,
  header .divider,
  header .lang-label {
    display: none;
  }
  .brand-name {
    font-size: var(--text-base);
  }
  #joblistwrapper {
    padding-top: var(--space-6);
  }
  #jobListHeading {
    font-size: var(--text-2xl);
  }
  .list-heading {
    margin-bottom: var(--space-2);
  }
  .board-views {
    gap: var(--space-4);
    margin-bottom: var(--space-4);
  }
  .view-tab {
    font-size: var(--text-sm);
  }
  #joblistwrapper #search-wrapper {
    flex-basis: 100%;
    min-width: 0;
  }
  #search-wrapper input,
  .sort-control select,
  .assistant-fields :is(input:not([type='checkbox']), select) {
    font-size: var(--text-lg);
  }
  .filter-chips {
    flex-basis: 100%;
  }
  .filter-btn {
    padding-inline: var(--space-3);
  }
  .dropdown {
    width: min(270px, calc(100vw - 32px));
  }
  #yoeDropdown {
    width: 200px;
  }
  .results-bar {
    padding-top: var(--space-2);
  }
  .result-count {
    text-wrap: balance;
  }
  .sort-control select {
    max-width: 200px;
  }
  #jobTable,
  #jobTable tbody {
    display: block;
    width: 100%;
  }
  #jobTable thead {
    display: none;
  }
  #jobTable tr:not(.date-separator) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2) var(--space-3);
    padding: var(--space-5) 0;
    margin: 0;
    border-bottom: 1px solid var(--border-color);
  }
  #jobTable tr:not(.date-separator) :is(td, td:first-child, td:last-child),
  #jobTable tr:not(.date-separator):has(:focus-visible) td {
    display: block;
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    background: transparent;
    white-space: normal;
  }
  #jobTable td.col-company,
  #jobTable td.col-job-title {
    flex: 0 0 100%;
  }
  .co-body {
    flex-direction: row;
    align-items: center;
    gap: var(--space-2);
  }
  .co-name {
    color: var(--secondary-text-color);
  }
  .avatar {
    width: 28px;
    height: 28px;
  }
  #jobTable td.col-yoe,
  #jobTable td.col-salary {
    flex: 0 1 auto;
  }
  #jobTable td:is(.col-yoe, .col-salary):has(.is-unknown) {
    display: none;
  }
  #jobTable td.col-link {
    flex: 0 0 100%;
    margin-top: var(--space-2);
  }
  .skeleton-row .col-salary .skeleton-text {
    width: 6rem;
  }
  .row-actions {
    justify-content: flex-start;
    width: 100%;
  }
  .date-separator,
  .date-separator td {
    display: block;
    width: 100%;
  }
  .date-separator td {
    padding-top: var(--space-5);
  }
  .assistant-intro {
    margin: var(--space-6) 0 var(--space-8);
  }
  .assistant-intro h2 {
    font-size: var(--text-xl);
  }
  .assistant-goal-summary {
    gap: var(--space-3);
    align-items: flex-start;
  }
  .assistant-goal-summary > button {
    padding-inline: var(--space-3);
  }
  .assistant-result {
    grid-template-columns: 1fr;
    gap: var(--space-4);
    padding: var(--space-5) 0;
  }
  .assistant-result .row-actions {
    max-width: none;
  }
  .detail-topbar,
  .detail-content,
  .detail-actions {
    padding-inline: var(--space-5);
  }
  .applied-archive-item {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-3);
  }
  .applied-archive-item .row-actions {
    justify-content: flex-start;
  }
  .consent-banner {
    flex-direction: column;
    align-items: stretch;
    padding-inline: var(--page-gutter);
    gap: var(--space-3);
  }
  .consent-banner-actions {
    justify-content: flex-end;
  }
  #toast-container {
    left: var(--page-gutter);
    right: var(--page-gutter);
    bottom: max(var(--page-gutter), env(safe-area-inset-bottom));
  }
  .toast {
    max-width: 100%;
  }
  .site-footer {
    flex-wrap: wrap;
  }
}
@media (max-width: 640px) {
  .assistant-preferences {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }
  .assistant-preferences-header {
    padding: var(--space-3) var(--space-5);
  }
  .assistant-preferences-body {
    padding: var(--space-5);
    flex: 1;
  }
  .assistant-fields {
    grid-template-columns: 1fr;
    gap: var(--space-5);
  }
  .assistant-field-pair {
    gap: var(--space-3);
  }
  .assistant-preferences-footer {
    padding: var(--space-3) var(--space-4) max(var(--space-3), env(safe-area-inset-bottom));
    gap: var(--space-2);
  }
  .assistant-preferences-footer > div {
    gap: var(--space-2);
  }
  .assistant-preferences-footer button {
    padding-inline: var(--space-2);
    font-size: var(--text-xs);
  }
}
@media (max-width: 350px) {
  .brand-name {
    display: none;
  }
  .sort-control select {
    max-width: 170px;
  }
  .assistant-field-pair {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}

/* Sync is an explicit workspace action, with per-device reminder controls. */
.sync-workspace-status { flex-shrink:0; margin:0; padding:0 var(--space-6) var(--space-3); }
.sync-dialog { width:min(560px,calc(100vw - 32px)); max-height:calc(100dvh - 48px); margin:auto; border:1px solid var(--border-color); border-radius:var(--radius-lg); padding:0; background:var(--background-color); color:var(--text-color); box-shadow:var(--shadow-dialog); }
.sync-dialog[open] { display:flex; flex-direction:column; animation:preferences-enter var(--motion-enter) var(--ease-out); }
.sync-dialog::backdrop { background:var(--overlay-bg-color); }
.sync-body { padding:var(--space-5) var(--space-6); overflow-y:auto; overscroll-behavior:contain; }
.sync-body h3 { font-size:var(--text-base); font-weight:var(--weight-semibold); color:var(--foreground); margin:0 0 var(--space-3); }
.sync-body p { margin:0 0 var(--space-3); }
.sync-body section+section,.sync-delete { margin-top:var(--space-5); padding-top:var(--space-5); border-top:1px solid var(--border-color); }

.sync-body input[type=password],.sync-body #syncCode { font-family:ui-monospace,monospace; }
.sync-body form { display:grid; gap:var(--space-3); margin-top:var(--space-4); }
.sync-body label { display:grid; gap:var(--space-2); }
.sync-body .assistant-check { display:flex; margin:var(--space-4) 0; }
.sync-body .workspace-inline-actions { margin:var(--space-3) 0; }
.sync-state { font-weight:600; }
#syncError:empty { display:none; }
#syncError { color:var(--secondary-text-color); font-size:var(--text-sm); }
.sync-body details summary { cursor:pointer; }
.sync-setting-row { display:flex; flex-wrap:wrap; align-items:end; gap:var(--space-4); }
.sync-setting-row label { max-width:150px; }
.sync-note-history p { white-space:pre-wrap; overflow-wrap:anywhere; }
@media(max-width:600px) {
 .sync-dialog { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); }
 .sync-body { padding:var(--space-4); }
 .sync-workspace-status { padding:0 var(--space-4) var(--space-3); }
 .workspace-header { gap:var(--space-2); }
 .workspace-header h2 { white-space:nowrap; }
 #workspaceSync { font-size:var(--text-xs); padding:var(--space-2); }
}

@media(max-width:600px) { .sync-body input:not([type=checkbox]) { font-size:1rem; } }
/* Discovery uses the shared field, surface, dialog and action tokens. */
.active-filters,
.filter-recovery,
.saved-search-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.active-filters,
.filter-recovery {
  margin: var(--space-2) 0 var(--space-3);
}

.recommendation-feedback {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-3);
  font-size: var(--text-sm);
}
.recommendation-feedback select {
  width: auto;
  max-width: 100%;
}
.saved-search-actions {
  order: 1;
  margin-left: auto;
}
.results-bar .sort-control {
  order: 2;
}
.job-date {
  font-size: var(--text-xs);
}
#joblistwrapper[data-load-state='error'] :is(.saved-search-actions, .active-filters) {
  display: none;
}
.saved-search-dialog {
  /* This is a centered dialog, so reset the shared job drawer geometry. */
  inset: 0;
  width: min(760px, calc(100vw - 2 * var(--dialog-gutter)));
  height: fit-content;
  max-height: calc(100dvh - 2 * var(--dialog-gutter));
  margin: auto;
  padding: var(--dialog-gutter);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--background-color);
  color: var(--text-color);
  box-shadow: var(--shadow-dialog);
}
.saved-search-dialog[open] {
  display: block;
  animation: preferences-enter var(--motion-enter) var(--ease-out);
}
.saved-search-dialog::backdrop {
  background: var(--overlay-bg-color);
}
body.saved-search-open {
  overflow: hidden;
}
.saved-search-dialog .detail-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  margin-bottom: var(--space-4);
}
.saved-search-dialog h2 {
  color: var(--foreground);
  font-size: var(--text-xl);
  font-weight: var(--weight-semibold);
  line-height: var(--line-heading);
}
.saved-search-dialog h3 {
  color: var(--foreground);
  font-size: var(--text-lg);
  font-weight: var(--weight-semibold);
  margin-bottom: var(--space-3);
}
.saved-search-dialog .detail-note {
  margin: 0 0 var(--space-5);
}
.saved-search-dialog .assistant-composer {
  display: flex;
  align-items: stretch;
  gap: var(--space-2);
  margin: var(--space-2) 0 var(--space-5);
  padding: 0;
  border: 0;
  background: transparent;
}
.saved-search-dialog .assistant-composer input {
  flex: 1;
}
.saved-search-dialog .assistant-composer .assistant-primary {
  width: auto;
  margin: 0;
  flex-shrink: 0;
  justify-content: center;
}
.search-time-fields {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  margin: var(--space-4) 0;
}
.search-time-fields label {
  display: grid;
  gap: var(--space-2);
  flex: 1;
  min-width: 140px;
  font-size: var(--text-sm);
}
.saved-search-dialog section:not(:empty) {
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--border-color);
}
.saved-search-dialog .workspace-list li {
  flex-wrap: wrap;
  gap: var(--space-3);
}
.saved-search-dialog .assistant-result-list > li {
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--border-color);
}
.sync-body details > summary,
.workspace-footer summary {
  min-height: var(--control-height);
  padding-block: var(--space-3);
}
#syncDeleteConfirmButton {
  background: var(--error-bg);
  border-color: var(--error-text);
  color: var(--error-text);
}
@media (max-width: 768px) {
  .results-bar .saved-search-actions {
    order: -1;
    flex-basis: 100%;
    margin: 0;
  }
  .saved-search-dialog input:not([type='checkbox']),
  .recommendation-feedback select {
    font-size: var(--text-lg);
  }
}
@media (max-width: 600px) {
  :root { --dialog-gutter: 1rem; }
  .saved-search-dialog .assistant-composer { flex-wrap: wrap; }
  .saved-search-dialog .assistant-composer .assistant-primary { width: 100%; }
  .sync-body { padding-bottom: max(var(--space-4), env(safe-area-inset-bottom)); }
}
@media (max-width: 480px) {
  #joblistwrapper > .board-views {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 var(--space-4);
  }
  #joblistwrapper > .board-views .view-tab {
    justify-content: space-between;
    min-height: var(--control-height);
  }
  #compareToggle { grid-column: 1 / -1; }
}


/* Resume tools. Reuses the shared palette, controls and interaction states. */
.resume-page { padding-top: 0; min-height: 100svh; display: flex; flex-direction: column; }
.resume-page * { box-sizing: border-box; }
.resume-page .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; }
header.resume-header.ktb-header { display: flex; position: static; height: auto; min-height: 76px; padding: 12px max(24px, calc((100vw - 1216px) / 2)); align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--border-color); background: var(--background-color); }
.resume-brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 15px; font-weight: 600; letter-spacing: -.02em; flex-shrink: 0; }
.resume-brand img { display: block; object-fit: contain; }
.resume-header-actions { display: flex; align-items: center; gap: 20px; font-size: var(--text-sm); }
.resume-header-actions > a { display: inline-flex; align-items: center; min-height: 44px; }
.resume-main { width: min(1216px, calc(100% - 64px)); margin: 0 auto; padding: 48px 0 80px; flex: 1; }
.resume-intro { margin-bottom: 28px; }
.resume-eyebrow { margin: 0 0 10px; font-size: 12px; letter-spacing: .12em; color: var(--secondary-text-color); }
.resume-intro h1 { font-size: clamp(28px, 3.2vw, 38px); line-height: 1.3; font-weight: 600; letter-spacing: -.035em; color: var(--foreground); margin: 0 0 10px; }
.resume-intro > p:last-child { margin: 0; color: var(--secondary-text-color); max-width: 70ch; }
.resume-tabs { display: flex; gap: 28px; border-bottom: 1px solid var(--border-color); margin-bottom: 32px; }
.resume-tabs button { min-height: 52px; border: 0; border-bottom: 2px solid transparent; padding: 8px 0; background: transparent; color: var(--secondary-text-color); font-weight: 500; }
.resume-tabs [aria-selected="true"] { color: var(--foreground); border-color: var(--keyword-button-on-text-color); }
.resume-check-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 64px; align-items: start; }
.resume-check-main { min-width: 0; }
.resume-upload { border: 1px dashed var(--border-color-2); border-radius: var(--radius-md); padding: 48px 28px 28px; background: var(--background-color-3); text-align: center; }
.resume-upload > svg { color: var(--secondary-text-color); margin: 0 auto 16px; display: block; }
.resume-upload h2 { margin: 0 0 8px; color: var(--foreground); font-size: 22px; font-weight: 500; letter-spacing: -.02em; }
.resume-upload > p { margin: 0 auto 22px; max-width: 45ch; }
.resume-upload #fileLimits { margin-top: 18px; margin-bottom: 0; font-size: 12px; }
.resume-upload.is-dragging { background: var(--keyword-button-on-bg-color); border-color: var(--keyword-button-on-text-color); }
.resume-check-main:has(#checkResults:not([hidden])) .resume-upload { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 20px; text-align: left; }
.resume-check-main:has(#checkResults:not([hidden])) .resume-upload > :is(svg,h2,#fileLimits) { display: none; }
.resume-check-main:has(#checkResults:not([hidden])) .resume-upload > p { margin: 0; font-size: 13px; flex: 1 1 220px; }
.resume-file-label { display: inline-flex; position: relative; cursor: pointer; overflow: hidden; }
.resume-file-label input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.resume-file-label:has(input:focus-visible) { outline: 2px solid var(--focus-color); outline-offset: 4px; }
.resume-file-label:has(input:disabled) { opacity: .5; cursor: wait; }
.resume-privacy { font-size: 13px; color: var(--secondary-text-color); margin: 14px 0 0; }
.resume-muted { color: var(--secondary-text-color); font-size: var(--text-sm); }
.resume-guide h2 { margin: 0 0 20px; font-size: 16px; color: var(--foreground); font-weight: 600; }
.resume-guide ol { list-style: decimal-leading-zero; padding: 0 0 0 26px; margin: 0; }
.resume-guide li { margin-bottom: 23px; padding-left: 6px; }
.resume-guide li::marker { font-size: 12px; color: var(--secondary-text-color); }
.resume-guide strong { font-size: 14px; color: var(--foreground); font-weight: 600; }
.resume-guide li p { margin: 5px 0 0; font-size: 13px; line-height: 1.75; color: var(--secondary-text-color); }
.resume-guide-boundary { border-top: 1px solid var(--border-color); padding-top: 18px; font-size: 12px; color: var(--secondary-text-color); }
.resume-page summary { cursor: pointer; padding: 12px 0; min-height: 44px; font-size: var(--text-sm); }
.resume-guide details { font-size: 12px; color: var(--secondary-text-color); }
.resume-guide details a { display: block; min-height: 44px; padding: 10px 0; text-decoration: underline; text-underline-offset: 3px; }
.resume-status { min-height: 0; font-size: 14px; color: var(--keyword-button-on-text-color); }
.resume-status:empty { margin: 0; }
.resume-error { color: var(--error-text); background: var(--error-bg); padding: 14px 16px; border-radius: var(--radius-md); }
.resume-section-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; }
.resume-section-heading :is(h2,h3) { margin: 0; font-size: 18px; font-weight: 600; color: var(--foreground); }
.resume-section-heading p { margin: 3px 0 0; overflow-wrap: anywhere; }
.resume-results { margin-top: 32px; border-top: 1px solid var(--border-color); padding-top: 24px; }
.resume-result-summary { margin: 20px 0; font-size: 16px; color: var(--foreground); }
.resume-facts { display: flex; gap: 20px 32px; flex-wrap: wrap; margin: 0 0 28px; padding-bottom: 20px; border-bottom: 1px solid var(--border-color); }
.resume-facts dt { color: var(--secondary-text-color); font-size: 12px; margin-bottom: 3px; }
.resume-facts dd { font-size: 22px; margin: 0; color: var(--foreground); font-variant-numeric: tabular-nums; }
.resume-findings { padding: 0; margin: 0; list-style: none; }
.resume-findings li { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--border-subtle); align-items: baseline; }
.resume-findings h3 { margin: 0 0 4px; font-size: 15px; font-weight: 600; color: var(--foreground); }
.resume-findings p { margin: 0; font-size: 13px; line-height: 1.75; color: var(--secondary-text-color); }
.resume-finding-state { color: var(--secondary-text-color); font-size: 12px; font-weight: 500; }
[data-state="pass"] .resume-finding-state { color: var(--keyword-button-on-text-color); }
[data-state="fix"] .resume-finding-state { color: var(--error-text); }
[data-state="review"] .resume-finding-state { color: var(--foreground); }
.resume-actions { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-top: 24px; }
.resume-extraction { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--border-color); }
.resume-order-label { display: flex; align-items: center; gap: 12px; margin: 18px 0 12px; font-size: 14px; flex-wrap: wrap; }
.resume-page :where(input:not([type='checkbox'],[type='radio'],[type='file']),textarea,select) { border: 1px solid var(--input-border); background: var(--background-color); color: var(--text-color); border-radius: var(--radius-md); padding: 10px 12px; min-height: 44px; font-size: 14px; }
.resume-page input[type="file"] { border: 0; padding: 0; }
.resume-page textarea { resize: vertical; line-height: 1.65; width: 100%; }
.resume-page :where(textarea,input:not([type='checkbox'],[type='radio'],[type='file'])):focus { outline: 2px solid var(--focus-color); outline-offset: 2px; }
#extractedText { font-family: ui-monospace, 'SFMono-Regular', Consolas, monospace; font-size: 13px; min-height: 240px; }
.resume-original { margin-top: 12px; }
.resume-canvas-wrap { width: 100%; max-height: 760px; overflow: auto; background: var(--background-color-2); }
.resume-canvas-wrap canvas { display: block; max-width: 100%; height: auto; margin: 0 auto; background: white; }
.resume-maker-heading { display: flex; align-items: start; justify-content: space-between; gap: 24px; margin: 0 0 28px; }
.resume-maker-heading h2 { margin: 0 0 6px; font-size: 22px; font-weight: 500; color: var(--foreground); }
.resume-maker-heading p { margin: 0; max-width: 68ch; }
.resume-maker-heading > button { flex-shrink: 0; }
.resume-maker-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 48px; align-items: start; }
.resume-form { min-width: 0; }
.resume-form fieldset { border: 0; border-bottom: 1px solid var(--border-color); padding: 0 0 24px; margin: 0 0 24px; min-width: 0; }
.resume-form legend { padding: 0; margin-bottom: 18px; font-weight: 600; color: var(--foreground); }
.resume-form label { display: flex; flex-direction: column; gap: 7px; margin: 0 0 16px; min-width: 0; font-size: 14px; scroll-margin-bottom:var(--space-4); }
.resume-form label input, .resume-form label select { width: 100%; }
.resume-form-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.resume-field-hint { font-size: 12px; color: var(--secondary-text-color); margin: -8px 0 20px; }
.resume-preview-column { min-width: 0; position: sticky; top: 24px; }
.resume-preview-column > .resume-muted { font-size: 12px; margin: 8px 0 14px; }
#resumePreview { display: block; width: 100%; height: 820px; border: 1px solid var(--border-color-2); background: #fff; }
.resume-preview-empty { padding: 40px 36px; min-height: 640px; border: 1px solid var(--border-color); background: var(--background-color-3); color: var(--secondary-text-color); }
.resume-preview-empty span { display: block; margin-bottom: 8px; font-size: 12px; letter-spacing: .03em; }
.resume-preview-empty .resume-sample-name { font-size: 28px; letter-spacing: -.03em; margin-bottom: 0; }
.resume-preview-empty hr { margin: 24px 0; border: 0; border-top: 1px solid var(--border-color-2); }
.resume-preview-empty i { display: block; height: 7px; background: var(--border-color); border-radius: 2px; margin: 16px 0; width: 90%; }
.resume-preview-empty i:nth-of-type(3n) { width: 64%; margin-bottom: 36px; }
.resume-preview-empty p { margin-top: 36px; font-size: 13px; }
.resume-print-note { font-size: 12px; color: var(--secondary-text-color); margin: 16px 0; }
.resume-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin: 0; padding: 24px max(24px, calc((100vw - 1216px) / 2)); border-top: 1px solid var(--border-color); font-size: 13px; color: var(--secondary-text-color); }
.resume-footer p { flex: 1; margin: 0; }
.resume-footer a { min-height: 44px; display: inline-flex; align-items: center; }
@media (hover: hover) and (pointer: fine) {
  .resume-tabs button:hover { color: var(--foreground); border-bottom-color: var(--selected-border); }
  .resume-header-actions > a:hover, .resume-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
  .resume-upload:has(.resume-file-label:hover) { border-color: var(--focus-color); }
}
.resume-tabs button:active { background: var(--surface-pressed); }
@media (max-width: 1000px) {
  .resume-check-layout { gap: 32px; grid-template-columns: minmax(0, 1fr) 260px; }
  .resume-maker-layout { gap: 24px; grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .resume-main { width: calc(100% - 32px); padding-top: 28px; padding-bottom: 48px; }
  header.resume-header.ktb-header { flex-wrap: wrap; gap: 0 12px; padding: 10px 16px; }
  .resume-header-actions { gap: 8px 12px; flex-wrap: wrap; }
  .resume-brand { font-size: 13px; }
  .resume-intro { margin-bottom: 20px; }
  .resume-check-layout, .resume-maker-layout { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .resume-guide { border-top: 1px solid var(--border-color); padding-top: 28px; }
  .resume-guide ol { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
  .resume-upload { padding: 32px 18px 24px; }
  .resume-upload h2 { font-size: 20px; }
  .resume-upload > p { font-size: 14px; }
  .resume-page :is(input,textarea,select), #extractedText { font-size: 16px; }
  .resume-findings li { grid-template-columns: 70px minmax(0,1fr); gap: 10px; }
  .resume-preview-column { position: static; }
  .resume-maker-heading { flex-wrap: wrap; gap: 16px; }
  .resume-footer { padding: 20px 16px; }
}
@media (max-width: 420px) {
  .resume-header-actions { width: 100%; justify-content: space-between; gap: 4px; }
  .resume-header-actions > a, .resume-header-actions > button { font-size: 13px; }
  .resume-form-pair { grid-template-columns: minmax(0,1fr); gap: 0; }
  .resume-guide ol { grid-template-columns: minmax(0,1fr); }
  .resume-facts { gap: 14px 24px; }
  .resume-facts dd { font-size: 20px; }
  .resume-footer p { flex-basis: calc(100% - 80px); }
}

/* Stable site shell: primary destinations never move between content views. */
html { scrollbar-gutter: stable; }
:root:has(> .site-page) {
 --header-height:72px;
 --sticky-header-height:var(--header-height);
 --page-tabs-height:48px;
 --resume-toolbar-height:80px;
 --resume-toolbar-offset:0px;
 --page-sticky-offset:calc(var(--sticky-header-height) + var(--page-tabs-height) + var(--resume-toolbar-offset));
 scroll-padding-top:calc(var(--page-sticky-offset) + var(--space-4));
}
:root:has(> .insights-page) { --page-tabs-height:0px; }
.site-page { --page-heading-height:80px; min-height:100svh; display:flex; flex-direction:column; padding-top:var(--header-height); }
body.site-page:has(dialog:modal) { overflow:hidden; }
.site-page dialog { box-sizing:border-box; }
.site-page .site-header { position:fixed; inset:0 0 auto; z-index:60; display:block; width:100%; height:var(--header-height); padding:0; background:var(--background-color); border-bottom:1px solid var(--border-color); }
.site-page :is(.site-header-inner, .site-main, .site-footer-inner) { box-sizing:border-box; width:min(var(--page-width), calc(100% - 2 * var(--page-gutter))); max-width:var(--page-width); margin-inline:auto; }
.site-header-inner { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:24px; height:100%; padding:0; }
.site-brand { display:inline-flex; align-items:center; gap:10px; min-height:44px; color:var(--foreground); font-size:15px; font-weight:600; letter-spacing:-.02em; white-space:nowrap; }
.site-brand img { width:30px; height:30px; object-fit:contain; }
.site-primary-nav { display:flex; align-self:center; justify-self:end; justify-content:flex-end; gap:4px; min-width:0; width:auto; }
.site-primary-nav a { display:flex; flex:0 0 auto; min-width:0; align-items:center; justify-content:center; min-height:44px; padding:10px 14px; border:0; border-radius:var(--radius-md); background:transparent; color:var(--secondary-text-color); font-size:14px; font-weight:500; white-space:nowrap; text-decoration:none; box-sizing:border-box; }
.site-primary-nav a[aria-current='page'] { background:var(--keyword-button-on-bg-color); color:var(--keyword-button-on-text-color); }
.site-preferences { display:flex; gap:8px; align-items:center; }
.site-preference { position:relative; }
.site-preferences summary { display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:8px 10px; list-style:none; color:var(--foreground); font-size:14px; cursor:pointer; user-select:none; }
.site-preferences summary::-webkit-details-marker { display:none; }
.site-preferences summary::after { content:none; display:none; }
.site-preferences .site-language,.site-preferences .site-theme { box-sizing:border-box; width:44px; min-width:44px; height:44px; }
.site-preferences summary svg { display:block; width:20px; height:20px; }
.site-preference[open] > summary { background:var(--surface-hover); }
.site-preference-options { position:absolute; z-index:1; inset:auto 0 auto auto; min-width:160px; margin:6px 0 0; padding:6px; border:1px solid var(--border-color); border-radius:var(--radius-md); background:var(--background-color); box-shadow:var(--shadow-popover); }
.site-preference-options label { display:flex; align-items:center; gap:10px; min-height:44px; padding:8px 10px; border-radius:var(--radius-md); color:var(--foreground); font-size:14px; cursor:pointer; box-sizing:border-box; white-space:nowrap; }
.site-preference-options label:has(input:checked) { background:var(--keyword-button-on-bg-color); color:var(--keyword-button-on-text-color); }
.site-preference-options input { width:16px; height:16px; margin:0; accent-color:var(--foreground); }
.site-preferences summary:focus-visible,.site-preference-options label:has(input:focus-visible) { outline:2px solid var(--focus-color); outline-offset:2px; }
.site-preference-options input:focus-visible { outline:none; }
@media (hover:hover) and (pointer:fine) { .site-preference-options label:hover { background:var(--surface-hover); } }
.site-footer-language { display:flex; align-items:center; gap:12px; white-space:nowrap; }
.site-footer-language select { min-height:44px; width:104px; padding:8px 10px; border:1px solid var(--input-border); border-radius:var(--radius-md); background:var(--background-color); color:var(--text-color); font-size:14px; }
.site-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; }
.site-page .site-main { flex:1; margin-block:0; padding:20px 0 40px; }
.site-page #joblistwrapper { max-width:none; margin:0; padding:0; }
.site-page .list-heading.page-heading { display:block; }
.site-page .page-heading { box-sizing:border-box; min-height:var(--page-heading-height); margin:0; padding:0; }
.site-page .page-heading h1 { margin:0; font-size:28px; line-height:1.3; letter-spacing:-.025em; font-weight:600; color:var(--foreground); }
.site-page .page-heading > p { margin:4px 0 0; min-height:24px; font-size:14px; line-height:1.6; color:var(--secondary-text-color); }
.site-page .workspace-page-heading > p { padding:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.site-page #joblistwrapper > .task-tabs, .site-page .resume-tabs { display:flex; flex-wrap:nowrap; align-items:stretch; gap:24px; position:sticky; top:var(--sticky-header-height); z-index:40; height:48px; min-height:48px; margin:0 0 16px; padding:0; background:var(--background-color); border-bottom:1px solid var(--border-color); }
.site-page .task-tabs .view-tab, .site-page .resume-tabs button { flex:0 0 auto; justify-content:center; min-height:44px; font-size:14px; font-weight:500; white-space:nowrap; }
.site-page .compare-shortcut { margin-left:auto; align-self:center; min-width:104px; font-size:13px; }
.site-page .compare-shortcut .view-count { display:inline-block; min-width:2ch; text-align:center; font-variant-numeric:tabular-nums; }
.site-page .workspace-page { width:100%; }
.workspace-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; min-height:44px; }
.workspace-title-row > button { flex-shrink:0; }
.site-page #workspaceTabs { position:sticky; top:var(--sticky-header-height); z-index:40; display:flex; flex-wrap:nowrap; align-items:stretch; gap:28px; height:48px; min-height:48px; margin:0; padding:0; background:var(--background-color); overflow-x:auto; overflow-y:hidden; scrollbar-width:none; }
.site-page #jobTable thead { top:calc(var(--sticky-header-height) + var(--page-tabs-height)); }
.site-page #workspaceTabs::-webkit-scrollbar { display:none; }
.site-page #workspaceTabs .view-tab { font-weight:500; }
.site-page #workspaceContent { min-height:280px; padding:16px 0; overflow:visible; }
.site-page #workspaceContent:has(> .workspace-empty) { display:flex; flex-direction:column; }
.site-page .workspace-empty { min-height:224px; }
.site-page .workspace-loading { padding:48px 0; text-align:center; color:var(--secondary-text-color); }
.site-page .workspace-footer { padding:16px 0; }
.site-page .workspace-footer button { display:inline-flex; }
.site-page .site-global-footer { display:block; width:100%; max-width:none; margin:0; padding:0; border-top:1px solid var(--border-color); color:var(--secondary-text-color); font-size:13px; }
.site-footer-inner { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px 32px; padding:20px 0; }
.site-footer-inner > p { display:flex; align-items:center; flex-wrap:wrap; gap:8px 20px; margin:0 auto 0 0; }
.site-footer-inner a { display:inline-flex; align-items:center; min-height:44px; }
.site-footer-inner > p > a { color:var(--foreground); font-weight:600; }
.site-footer-inner nav { display:flex; align-items:center; flex-wrap:wrap; gap:8px 24px; }
.site-global-footer .assistant-text-btn { font-size:13px; padding:8px 0; }
.site-page .resume-upload { padding:32px 24px 24px; }
.site-page [hidden] { display:none !important; }
@media (hover:hover) and (pointer:fine) {
 .site-primary-nav a:not([aria-current]):hover { color:var(--foreground); background:var(--surface-hover); }
 .site-primary-nav a[aria-current]:hover { background:var(--selected-hover); }
 .site-footer-inner a:hover { text-decoration:underline; text-underline-offset:4px; }
}
.site-primary-nav a:active { background:var(--surface-pressed); }
.site-primary-nav a[aria-current]:active { background:var(--selected-pressed); }
@media (max-width:820px) {
 :root:has(> .site-page) { --header-height:116px; }
 .site-page { --page-gutter:1rem; --page-heading-height:96px; }
 .site-header-inner { grid-template-columns:minmax(0,1fr) auto; grid-template-rows:64px 52px; gap:0 12px; }
 .site-brand { grid-column:1; grid-row:1; font-size:14px; }
 .site-preferences { grid-column:2; grid-row:1; }
 .site-primary-nav { grid-column:1/-1; grid-row:2; gap:4px; justify-content:flex-start; justify-self:stretch; width:100%; overflow-x:auto; scrollbar-width:none; }
 .site-primary-nav a { min-width:44px; padding:8px; font-size:13px; }
 .site-footer-language select { font-size:16px; }
 .site-page .site-main { padding:16px 0 32px; }
 .site-page #joblistwrapper > .task-tabs, .site-page .resume-tabs { gap:16px; }
 .site-page .task-tabs .view-tab, .site-page .resume-tabs button { font-size:13px; }
 .site-page .compare-shortcut { min-width:88px; padding:8px; font-size:12px; }
 .site-page #workspaceTabs { gap:24px; }
 .workspace-title-row { gap:8px; }
 .site-page .page-heading h1, .site-page #joblistwrapper .page-heading h1 { font-size:26px; }
 .workspace-title-row > button { padding:8px 10px; font-size:12px; }
 .site-footer-inner { padding:16px 0; }
 .site-footer-inner > p { flex-basis:100%; }
 .site-page .resume-upload { padding:24px 16px; }
}

@media (max-width:360px) {
 .site-page { --page-heading-height:104px; }
 .site-page .page-heading h1, .site-page #joblistwrapper .page-heading h1 { font-size:24px; }
}

/* Resume workflow controls stay inside the established page grid. */
.resume-draft-bar { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; }
.resume-draft-settings { display:grid; gap:8px; border-top:1px solid var(--border-color); padding:16px 0; margin:16px 0 0; }
.resume-draft-settings .assistant-check { display:flex; flex-direction:row; align-items:center; gap:10px; min-height:44px; }
.resume-draft-settings input[type='checkbox'] { width:18px; height:18px; min-height:18px; padding:0; flex:none; }
.resume-draft-settings p { margin:0; }
.resume-draft-settings :is(#draftRecovery,#draftConflict) { padding:12px 0; border-top:1px solid var(--border-color); }
.resume-draft-settings :is(#draftRecovery,#draftConflict) button { margin:8px 8px 0 0; }
.resume-readiness { padding:12px 0 16px; font-size:13px; color:var(--secondary-text-color); }
.resume-readiness > p { margin:0; }
.resume-readiness button { font-size:13px; padding:8px 10px; }
.resume-secondary-actions { margin-top:8px; }
.resume-secondary-actions button { padding-inline:0; }
.resume-pdf-controls { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 12px; }
.resume-pdf-controls select { width:auto; min-width:100px; max-width:150px; }
.resume-pdf-controls button { padding:8px 12px; }
.resume-pdf-viewport { max-height:min(70svh,760px); overflow:auto; background:#fff; border:1px solid var(--border-color); margin-top:12px; }
#exportCanvas { display:block; height:auto; }
#pdfStale { margin:0 0 8px; }
#pdfOutput, .resume-original { scroll-margin-top:0; }
.site-page .resume-preview-empty { min-height:320px; padding:32px; }
.resume-import-dialog { width:min(900px,calc(100% - 32px)); max-height:calc(100svh - 32px); padding:24px; border:1px solid var(--border-color); border-radius:var(--radius-lg); background:var(--background-color); color:var(--text-color); overflow:auto; }
.resume-import-dialog::backdrop { background:var(--overlay-bg-color); }
.resume-import-dialog > .resume-section-heading { position:sticky; top:0; z-index:4; padding-block:8px; background:var(--background-color); box-shadow:0 -24px var(--background-color); border-bottom:1px solid var(--border-color); }
.resume-import-dialog h2 { font-size:22px; font-weight:600; }
.resume-import-dialog h3 { font-size:17px; font-weight:600; margin:12px 0 8px; }
.resume-import-dialog p { overflow-wrap:anywhere; }
.resume-import-paste, .resume-import-remainder label { display:flex; flex-direction:column; gap:6px; margin:16px 0; font-size:14px; }
.resume-import-paste textarea, .resume-import-remainder textarea { width:100%; resize:vertical; }
#importReviewForm { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; margin-top:16px; }
#importReviewForm label { margin:0; min-width:0; }
.resume-import-wide { grid-column:1/-1; }
.resume-import-source { margin-top:16px; border-top:1px solid var(--border-color); }
.resume-import-source pre { max-height:240px; overflow:auto; white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; }
.resume-import-actions { position:sticky; bottom:-24px; padding:12px 0; margin-top:16px; border-top:1px solid var(--border-color); background:var(--background-color); }
.resume-findings > ul, .resume-findings > details > ul { list-style:none; padding:0; margin:0; }
.resume-findings li { display:grid; grid-template-columns:90px minmax(0,1fr); gap:16px; padding:16px 0; border-top:1px solid var(--border-color); }
.resume-findings-heading { font-size:16px; font-weight:600; margin:0 0 8px; }
.resume-findings > details { border-top:1px solid var(--border-color); }
.resume-evidence { margin-top:8px; }
.resume-evidence p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:13px; }
@media(max-width:600px) {
 .resume-import-dialog { padding:16px; width:calc(100% - 24px); max-height:calc(100svh - 24px); }
 #importReviewForm { grid-template-columns:minmax(0,1fr); }
 .resume-import-actions { bottom:-16px; }
 .resume-findings li { grid-template-columns:76px minmax(0,1fr); gap:12px; }
}

.resume-editor-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; position:sticky; top:calc(var(--sticky-header-height) + var(--page-tabs-height)); z-index:8; background:var(--background-color); border-bottom:1px solid var(--border-color); padding:12px 0; margin:0 0 8px; }
.resume-editor-toolbar :is(.resume-draft-bar,.resume-actions) { margin:0; }
.resume-draft-settings { border-top:0; margin:0 0 20px; padding:0 0 12px; border-bottom:1px solid var(--border-color); gap:2px; }
.resume-draft-settings .assistant-check { margin-bottom:0; }
.resume-draft-settings > .resume-field-hint { margin-left:28px; }
.resume-draft-settings #draftSaveStatus { font-size:12px; margin-left:28px; }
.resume-draft-settings #resetDraft { justify-self:start; padding:4px 0; margin-left:28px; font-size:12px; }
.resume-print-note { margin-top:12px; }
@media(max-width:760px) {
 .resume-editor-toolbar { position:static; padding:8px 0; gap:8px; }
 .resume-editor-toolbar > .resume-draft-bar { gap:8px; }
 .resume-editor-toolbar button { padding-inline:10px; }
}

.resume-export-feedback { flex-basis:100%; min-width:0; }
.resume-export-feedback .resume-status { margin:0; min-height:22px; }
.resume-export-feedback button { padding:4px 8px; }
.resume-export-feedback p { overflow-wrap:anywhere; }
@media(max-width:760px) { .resume-export-feedback .resume-status:empty { min-height:0; } }
@media(min-width:761px) and (min-height:641px) {
 :root:has(> .resume-page #makePanel:not([hidden])) { --resume-toolbar-offset:var(--resume-toolbar-height); }
 .site-page .resume-preview-column { top:calc(var(--page-sticky-offset) + var(--space-4)); }
 .resume-pdf-viewport { max-height:min(680px,calc(100dvh - var(--page-sticky-offset) - 200px)); }
}
.resume-form :is(input,textarea,select) { scroll-margin-top:0; }

/* In a short viewport, keep only the current task tabs on screen. The PDF
   follows the document so reading never depends on a tiny nested scroller. */
@media(max-height:640px) {
 :root:has(> .site-page) { --sticky-header-height:0px; }
 .site-page { padding-top:0; }
 .site-page .site-header { position:relative; inset:auto; flex:none; }
 .resume-editor-toolbar { position:static; }
 .resume-maker-layout { grid-template-columns:minmax(0,1fr); }
 .site-page .resume-preview-column { position:static; }
 .resume-pdf-viewport { max-height:none; overflow:visible; }
}

/* Repeated resume entries share the existing editor grid and control system. */
.resume-entry-section { margin:24px 0; min-width:0; }
.resume-entry-section-title { margin:0 0 12px; font-size:14px; font-weight:600; color:var(--foreground); }
.resume-entry { position:relative; border-top:1px solid var(--border-color); min-width:0; }
.resume-entry:last-child { border-bottom:1px solid var(--border-color); }
.resume-entry > details > summary { display:flex; align-items:center; gap:10px; min-height:64px; padding:10px 136px 10px 0; list-style:none; cursor:pointer; border-radius:var(--radius-sm); }
.resume-entry > details > summary::-webkit-details-marker { display:none; }
.resume-entry > details > summary::before { content:''; display:block; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(-45deg); flex-shrink:0; margin-left:2px; }
.resume-entry > details[open] > summary::before { transform:rotate(45deg); }
.resume-entry > details > summary:focus-visible { outline:2px solid var(--focus-color); outline-offset:3px; }
.resume-entry-number { font-size:12px; color:var(--secondary-text-color); min-width:12px; font-variant-numeric:tabular-nums; }
.resume-entry-summary { min-width:0; }
.resume-entry-title { display:block; font-size:14px; font-weight:600; overflow-wrap:anywhere; }
.resume-entry-meta { display:block; font-size:12px; color:var(--secondary-text-color); overflow-wrap:anywhere; }
.resume-entry-actions { position:absolute; right:0; top:10px; display:flex; gap:0; }
.resume-entry-action { width:44px; min-width:44px; height:44px; padding:0; }
.resume-entry-action svg { display:block; width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.resume-entry-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; padding:8px 0 20px; }
.resume-form .resume-entry-body > label { grid-column:1/-1; margin:0; }
.resume-form .resume-entry-body > .resume-entry-half { grid-column:auto; }
.resume-entry-body .resume-field-hint { grid-column:1/-1; margin:0; }
.resume-entry-add { margin-top:12px; }
.resume-entry-empty { margin:0 0 8px; font-size:13px; }
.resume-entry-feedback { display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; font-size:13px; color:var(--secondary-text-color); }
.resume-entry-feedback [role='status']:empty { display:none; }
.resume-entry-feedback button { padding-inline:4px; }
.resume-entry-section > .resume-error { margin:8px 0 0; }
#importReviewForm > .resume-entry-section { margin:0; }
@media(max-width:400px) {
 .resume-form .resume-entry-body > .resume-entry-half { grid-column:1/-1; }
 .resume-entry > details > summary { gap:6px; }
}

.resume-entry > details > summary { padding-left:50px; }
.resume-entry-number { display:none; }
.resume-entry-drag-handle { position:absolute; left:0; top:10px; width:44px; min-width:44px; height:44px; padding:0; cursor:grab; touch-action:none; user-select:none; -webkit-user-select:none; }
.resume-entry-drag-handle:disabled { cursor:default; }
.resume-entry-drag-handle svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; }
.resume-entry-drag-handle.is-dragging { cursor:grabbing; outline:none; }
.resume-entry-drag-source > details { opacity:.35; }
.resume-entry-dragging, .resume-entry-dragging * { cursor:grabbing !important; user-select:none !important; -webkit-user-select:none !important; }
.resume-entry-drag-ghost { position:fixed; z-index:90; box-sizing:border-box; max-width:calc(100vw - 16px); padding:12px 16px; border:1px solid var(--selected-border); border-radius:var(--radius-md); background:var(--background-color); color:var(--foreground); box-shadow:var(--shadow-popover); pointer-events:none; }
.resume-entry-drag-ghost strong, .resume-entry-drag-ghost span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.resume-entry-drag-ghost strong { font-size:14px; font-weight:600; }
.resume-entry-drag-ghost span { font-size:12px; color:var(--secondary-text-color); }
.resume-entry-drag-ghost.resume-drag-invalid { opacity:.5; }
.resume-entry-drop-line { position:fixed; z-index:85; height:3px; background:var(--focus-color); border-radius:2px; pointer-events:none; }

.resume-entry-moved > details > summary { background:var(--keyword-button-on-bg-color); }
@media(prefers-reduced-motion:no-preference) {
 .resume-entry > details > summary { transition:background-color .3s ease; }
}
.resume-entry-drag-ghost .resume-entry-drag-position { margin-top:6px; color:var(--keyword-button-on-text-color); font-weight:600; }
.resume-entry-placement { position:fixed; inset:auto; z-index:95; box-sizing:border-box; width:300px; max-width:calc(100vw - 16px); margin:0; padding:16px; overflow:auto; color:var(--foreground); background:var(--background-color); border:1px solid var(--border-color-2); border-radius:var(--radius-md); box-shadow:var(--shadow-popover); }
.resume-entry-placement > strong { display:block; font-size:14px; font-weight:600; }
.resume-entry-placement-name { margin:4px 0 12px; overflow-wrap:anywhere; font-size:13px; color:var(--secondary-text-color); }
.resume-entry-placement > label { display:grid; gap:6px; margin:0 0 12px; font-size:13px; }
.resume-entry-placement select { box-sizing:border-box; width:100%; min-width:0; height:44px; padding:0 10px; border:1px solid var(--input-border); border-radius:var(--radius-md); color:var(--foreground); background:var(--background-color); font:inherit; }
.resume-entry-placement-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.resume-entry-placement-actions button { min-width:0; min-height:44px; }
.resume-entry-placement [data-entry-placement='apply'] { grid-column:2; grid-row:2; }
.resume-entry-placement [data-entry-placement='cancel'] { grid-column:1; grid-row:2; }

/* Filling, reviewing and downloading share one stable resume workspace. */
.resume-section-nav { display:flex; flex-wrap:wrap; column-gap:16px; margin:0 0 4px; font-size:13px; }
.resume-section-nav a { display:inline-flex; align-items:center; min-height:44px; color:var(--secondary-text-color); text-decoration:underline; text-underline-offset:4px; }
.resume-section-nav a:hover { color:var(--foreground); }
.resume-readiness { padding:0 0 8px; }
.resume-readiness summary { min-height:44px; cursor:pointer; padding:8px 0; }
.resume-readiness button { min-height:44px; padding:6px 10px 6px 0; }
#requiredHint { margin:0 0 16px; }
.resume-required { color:var(--secondary-text-color); }
.resume-error-summary { border-inline-start:3px solid var(--error-text); border-radius:var(--radius-md); background:var(--error-bg); color:var(--foreground); padding:var(--space-3) var(--space-4); margin:var(--space-1) 0 var(--space-4); font-size:var(--text-sm); scroll-margin-top:0; }
.resume-error-summary:focus { outline:2px solid var(--focus-color); outline-offset:3px; }
.resume-error-summary strong { font-weight:600; }
.resume-error-summary ul { margin:6px 0 0; padding:0; list-style:none; }
.resume-error-summary a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; text-underline-offset:3px; }
.resume-field-error { display:block; margin:0; font-size:13px; color:var(--error-text); }
.resume-form [aria-invalid='true'] { border-color:var(--error-text); }
.resume-form .resume-draft-settings { margin:0 0 16px; padding:4px 0 0; border:0; }
.resume-export-feedback { display:flex; align-items:center; flex-wrap:wrap; gap:2px 12px; }
.resume-export-feedback #makeStatus { flex:1 1 60%; }
.resume-mode-announcement { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.resume-preview-modes { display:inline-flex; gap:2px; padding:3px; margin:0 0 12px; background:var(--background-color-2); border-radius:var(--radius-sm); }
.resume-preview-modes button { min-height:38px; padding:6px 12px; border:0; border-radius:var(--radius-sm); font:inherit; font-size:13px; color:var(--secondary-text-color); background:transparent; cursor:pointer; }
.resume-preview-modes button[aria-pressed='true'] { color:var(--foreground); background:var(--background-color); box-shadow:0 1px 3px rgba(0,0,0,.08); font-weight:600; }
.resume-preview-modes button:hover { color:var(--foreground); }
.resume-preview-modes button:focus-visible { outline:2px solid var(--focus-color); outline-offset:2px; }
.resume-preview-modes button:disabled { cursor:wait; }
.resume-preview-return { display:none; }
.resume-pdf-document-info { margin:0 0 10px; font-size:12px; color:var(--secondary-text-color); overflow-wrap:anywhere; }
.resume-pdf-controls { gap:6px; margin-bottom:6px; }
.resume-pdf-controls :is(#pdfPrevious,#pdfNext) { width:44px; min-width:44px; min-height:44px; padding:0; font-size:24px; }
.resume-pdf-controls select { min-height:44px; min-width:88px; max-width:130px; padding-inline:8px; }
.resume-pdf-auto { display:inline-flex; align-items:center; gap:8px; min-height:44px; margin:0; font-size:12px; }
.resume-pdf-auto input { width:16px; height:16px; margin:0; }
.resume-preview-empty button { margin-top:8px; }
@media(max-width:760px), (max-height:640px) {
 .resume-preview-return { display:inline-flex; min-height:44px; align-items:center; padding:4px 0 4px 12px; }
 .resume-preview-modes button { min-height:44px; }
 .resume-maker-layout { gap:24px; }
}
.resume-draft-bar { flex-wrap:wrap; }
.resume-draft-bar .resume-save-shortcut { min-height:44px; padding:4px 6px; font-size:12px; color:var(--secondary-text-color); text-decoration:underline; text-underline-offset:3px; }
#makeStatus[data-state='error'] { color:var(--error-text); }
#makeStatus[data-state='warning'] { color:var(--secondary-text-color); }

/* File progress is local, cancellable, and separate from the retained result. */
.resume-file-work { margin:12px 0 0; }
.resume-file-info { margin:0 0 6px; font-size:13px; color:var(--secondary-text-color); overflow-wrap:anywhere; }
.resume-file-work .resume-status { margin:4px 0; }
.resume-file-work progress { display:block; width:100%; height:6px; margin:10px 0; accent-color:var(--focus-color); }
.resume-file-work progress[hidden] { display:none; }
.resume-file-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.resume-file-actions :is(button,a) { min-height:44px; display:inline-flex; align-items:center; font-size:13px; }
.resume-file-actions :is(button,a)[hidden] { display:none; }
.resume-file-actions:empty { display:none; }
.resume-retained-result { padding:8px 0; margin:0 0 12px; color:var(--secondary-text-color); font-size:13px; border-bottom:1px solid var(--border-color); }
.resume-import-drop { padding:16px; border:1px dashed var(--border-color-2); border-radius:var(--radius-md); }
.resume-import-drop .resume-field-hint { margin:8px 0 0; }
.resume-import-drop.is-dragging { background:var(--keyword-button-on-bg-color); border-color:var(--focus-color); outline:2px solid var(--focus-color); outline-offset:2px; }
.resume-file-label:has(input[aria-invalid='true']) { outline:2px solid var(--error-text); outline-offset:3px; }
#resultHeading:focus-visible { outline:2px solid var(--focus-color); outline-offset:4px; }
.resume-check-main:has(#checkResults:not([hidden])) .resume-upload > #fileLimits { display:block; flex-basis:100%; font-size:12px; }
.resume-file-work > .resume-error { margin:8px 0; }