.step50-resume-ai {
  --step50-bg: #f5f7f4;
  --step50-surface: #ffffff;
  --step50-soft: #eef3ed;
  --step50-ink: #1f2a24;
  --step50-muted: #65736a;
  --step50-line: #cfd9d0;
  --step50-primary: #226b4d;
  --step50-primary-ink: #ffffff;
  --step50-warning-bg: #fff0e6;
  --step50-warning-ink: #7a3f12;
  color: var(--step50-ink);
  background: var(--step50-bg);
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 20px;
  font-size: 16px;
}

.step50-resume-ai * {
  box-sizing: border-box;
}

.step50-resume-ai button,
.step50-resume-ai input,
.step50-resume-ai textarea,
.step50-resume-ai select {
  font: inherit;
}

.step50-resume-ai h2,
.step50-resume-ai h3,
.step50-resume-ai p {
  margin-top: 0;
}

.step50-resume-ai__header,
.step50-resume-ai__tabs,
.step50-card__header,
.step50-button-row {
  display: flex;
  gap: 12px;
  align-items: center;
}

.step50-resume-ai__header {
  justify-content: space-between;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--step50-line);
  margin-bottom: 16px;
}

.step50-resume-ai__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.step50-resume-ai__sample {
  margin: 0 0 16px;
}

.step50-resume-ai__sample figcaption {
  color: var(--step50-ink);
  font-weight: 700;
  margin-bottom: 8px;
}

.step50-resume-ai__sample img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-surface);
}

.step50-resume-ai__eyebrow,
.step50-card__label {
  color: var(--step50-muted);
  font-size: 0.86em;
  margin-bottom: 4px;
}

.step50-resume-ai__tabs {
  flex-wrap: wrap;
  margin-bottom: 16px;
}

.step50-resume-ai__tabs button,
.step50-button,
.step50-small-button {
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-surface);
  color: var(--step50-ink);
  min-height: 40px;
  padding: 8px 12px;
  cursor: pointer;
  text-decoration: none;
}

.step50-resume-ai__tabs button.is-active,
.step50-button--primary {
  border-color: var(--step50-primary);
  background: var(--step50-primary);
  color: var(--step50-primary-ink);
}

.step50-button-row {
  flex-wrap: wrap;
}

.step50-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.step50-save-status {
  color: var(--step50-muted);
  font-size: 0.92em;
  min-height: 1.4em;
}

.step50-save-status[data-type="saved"] {
  color: var(--step50-primary);
  font-weight: 700;
}

.step50-save-status[data-type="error"] {
  color: var(--step50-warning-ink);
  font-weight: 700;
}

.step50-button[data-state="saving"] {
  cursor: wait;
  opacity: 0.72;
}

.step50-button[data-state="saved"] {
  border-color: var(--step50-primary);
  background: var(--step50-primary);
  color: var(--step50-primary-ink);
}

.step50-resume-ai__notice,
.step50-resume-ai__limits,
.step50-resume-ai-login-required {
  background: var(--step50-surface);
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 16px;
  color: var(--step50-muted);
}

.step50-resume-ai__limits {
  background: var(--step50-soft);
  margin-top: -8px;
}

.step50-resume-ai-link-card {
  --step50-surface: #ffffff;
  --step50-soft: #eef3ed;
  --step50-ink: #1f2a24;
  --step50-muted: #65736a;
  --step50-line: #cfd9d0;
  --step50-primary: #226b4d;
  --step50-primary-ink: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-surface);
  color: var(--step50-ink);
  padding: 18px;
  margin: 16px 0;
}

.step50-resume-ai-link-card h3,
.step50-resume-ai-link-card p {
  margin-top: 0;
}

.step50-resume-ai-link-card h3 {
  margin-bottom: 6px;
}

.step50-resume-ai-link-card p {
  color: var(--step50-muted);
  margin-bottom: 0;
}

.step50-resume-ai-link-card__eyebrow {
  font-size: 0.86em;
  margin-bottom: 4px !important;
}

.step50-resume-ai-link-card__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border-radius: 8px;
  padding: 9px 14px;
  background: var(--step50-primary);
  color: var(--step50-primary-ink);
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
}

.step50-resume-ai-guide {
  --step50-surface: #ffffff;
  --step50-soft: #eef3ed;
  --step50-ink: #1f2a24;
  --step50-muted: #65736a;
  --step50-line: #cfd9d0;
  --step50-primary: #226b4d;
  --step50-primary-ink: #ffffff;
  color: var(--step50-ink);
  background: var(--step50-surface);
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 22px;
  margin: 16px 0;
}

.step50-resume-ai-guide * {
  box-sizing: border-box;
}

.step50-resume-ai-guide,
.step50-resume-ai-guide h2,
.step50-resume-ai-guide h3,
.step50-resume-ai-guide h4,
.step50-resume-ai-guide li,
.step50-resume-ai-guide span {
  color: var(--step50-ink) !important;
}

.step50-resume-ai-guide p,
.step50-resume-ai-guide__header p,
.step50-resume-ai-guide__step p,
.step50-resume-ai-guide__notice p {
  color: var(--step50-muted) !important;
}

.step50-resume-ai-guide__step,
.step50-resume-ai-guide__notice {
  background-color: var(--step50-soft);
}

.step50-resume-ai-guide__notice {
  background-color: var(--step50-surface);
}

.step50-resume-ai-guide a:not(.step50-resume-ai-link-card__button) {
  color: var(--step50-primary) !important;
}

.step50-resume-ai-guide__eyebrow {
  color: var(--step50-muted) !important;
}

.step50-resume-ai-guide__step > span,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button:visited,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button:hover,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button:focus {
  color: var(--step50-primary-ink) !important;
}

.step50-resume-ai-guide h2,
.step50-resume-ai-guide h3,
.step50-resume-ai-guide p {
  margin-top: 0;
}

.step50-resume-ai-guide__header {
  border-bottom: 1px solid var(--step50-line);
  padding-bottom: 16px;
  margin-bottom: 16px;
}

.step50-resume-ai-guide__header p {
  color: var(--step50-muted);
  margin-bottom: 0;
}

.step50-resume-ai-guide__eyebrow {
  color: var(--step50-muted);
  font-size: 0.86em;
  margin-bottom: 4px !important;
}

.step50-resume-ai-guide__steps {
  display: grid;
  gap: 12px;
}

.step50-resume-ai-guide__step {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  gap: 12px;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-soft);
  padding: 14px;
}

.step50-resume-ai-guide__step span {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: var(--step50-primary);
  color: var(--step50-primary-ink);
  font-weight: 700;
}

.step50-resume-ai-guide__step h3 {
  margin-bottom: 4px;
}

.step50-resume-ai-guide__step p {
  color: var(--step50-muted);
  margin-bottom: 0;
}

.step50-resume-ai-guide__notice {
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 14px 16px;
  margin-top: 16px;
}

.step50-resume-ai-guide__notice h3 {
  margin-bottom: 8px;
}

.step50-resume-ai-guide__notice h4 {
  color: var(--step50-ink);
  font-size: 0.98em;
  margin: 14px 0 6px;
}

.step50-resume-ai-guide__notice p {
  color: var(--step50-muted);
  line-height: 1.75;
  margin-bottom: 10px;
}

.step50-resume-ai-guide__notice a {
  color: var(--step50-primary);
  font-weight: 700;
}

.step50-resume-ai-guide__notice ul {
  margin: 0 0 10px;
  padding-left: 1.2em;
}

.step50-resume-ai-guide__notice li + li {
  margin-top: 6px;
}

.step50-resume-ai-guide__actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}

.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button:visited,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button:hover,
.step50-resume-ai-guide__actions .step50-resume-ai-link-card__button:focus {
  color: var(--step50-primary-ink) !important;
}

.step50-resume-ai__notice[data-type="error"] {
  color: var(--step50-warning-ink);
  background: var(--step50-warning-bg);
  border-color: #e3ad75;
}

.step50-view {
  display: none;
}

.step50-view.is-active {
  display: block;
}

.step50-grid {
  display: grid;
  gap: 14px;
}

.step50-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.step50-card {
  background: var(--step50-surface);
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 16px;
}

.step50-card__header {
  justify-content: space-between;
  margin-bottom: 12px;
}

.step50-card strong {
  display: block;
  margin-bottom: 4px;
  font-size: 1.1em;
}

.step50-card span,
.step50-card p {
  color: var(--step50-muted);
}

.step50-form {
  display: grid;
  gap: 16px;
}

.step50-form fieldset {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-surface);
  padding: 16px;
  margin: 0;
}

.step50-form legend {
  padding: 0 8px;
  font-weight: 700;
}

.step50-form label {
  display: grid;
  gap: 6px;
  font-weight: 600;
}

.step50-form--single {
  gap: 12px;
}

.step50-form--single label,
.step50-form__wide {
  grid-column: 1 / -1;
}

.step50-form input,
.step50-form textarea,
.step50-form select {
  width: 100%;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-surface);
  color: var(--step50-ink);
  padding: 10px 12px;
}

.step50-inline-frequency {
  display: grid;
  grid-template-columns: auto minmax(72px, 120px) auto;
  align-items: center;
  justify-content: start;
  gap: 8px;
  color: var(--step50-ink);
  font-weight: 500;
}

.step50-inline-frequency input {
  text-align: right;
}

.step50-form textarea {
  resize: vertical;
}

.step50-form-help {
  grid-column: 1 / -1;
  color: var(--step50-muted);
  margin: 0;
  line-height: 1.65;
}

.step50-work-history {
  display: grid;
  gap: 12px;
}

.step50-work-history__list {
  display: grid;
  gap: 12px;
}

.step50-work-history__item {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(220px, 1.1fr);
  gap: 14px;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-surface);
  padding: 16px;
}

.step50-work-history__header {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}

.step50-work-history__header strong {
  color: var(--step50-ink);
}

.step50-work-history__period {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.step50-work-history__content,
.step50-work-history__contribution {
  border-top: 1px solid var(--step50-line);
  padding-top: 12px;
}

.step50-work-history__item textarea {
  min-height: 126px;
}

.step50-resume-ai__split {
  display: grid;
  grid-template-columns: minmax(260px, 0.82fr) minmax(0, 1.18fr);
  gap: 16px;
  align-items: start;
}

.step50-document-list {
  display: grid;
  gap: 10px;
}

.step50-document-item {
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 12px;
  display: grid;
  gap: 10px;
}

.step50-document-item.is-active {
  border-color: var(--step50-primary);
}

.step50-document-item p {
  margin-bottom: 0;
}

.step50-status-tag {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border: 1px solid var(--step50-primary);
  border-radius: 999px;
  color: var(--step50-primary);
  background: var(--step50-soft);
  font-size: 0.84em;
  font-weight: 700;
  line-height: 1.2;
  padding: 4px 8px;
  margin-top: 8px;
}

.step50-document-item__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.step50-review-status {
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  background: var(--step50-soft);
  color: var(--step50-muted);
  padding: 10px 12px;
  margin-bottom: 0;
}

.step50-review-status[data-type="requested"] {
  border-color: var(--step50-primary);
  color: var(--step50-primary);
  font-weight: 700;
}

.step50-empty {
  color: var(--step50-muted);
  margin-bottom: 0;
}

.step50-photo-editor {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 180px;
  gap: 16px;
  align-items: start;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 14px;
  background: var(--step50-soft);
}

.step50-photo-editor > div > span {
  display: block;
  color: var(--step50-ink);
  font-weight: 700;
  margin-bottom: 4px;
}

.step50-photo-editor p {
  color: var(--step50-muted);
  margin: 0 0 10px;
}

.step50-photo-editor__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.step50-photo-editor__actions input[type="file"] {
  display: none;
}

.step50-photo-editor__canvas-wrap {
  display: grid;
  gap: 8px;
}

.step50-photo-editor canvas {
  display: block;
  width: 150px;
  height: 200px;
  border: 1px solid var(--step50-line);
  background: #fff;
  touch-action: none;
}

.step50-photo-editor__canvas-wrap label {
  color: var(--step50-muted);
  font-size: 0.9em;
}

.step50-photo-editor__canvas-wrap input[type="range"] {
  width: 150px;
}

.step50-preview {
  background: #dfe7df;
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 16px;
  overflow-x: auto;
}

.step50-template-preview__page {
  position: relative;
  width: 1120px;
  max-width: none;
  aspect-ratio: 1191 / 842;
  background: #fff;
  color: #111;
  overflow: hidden;
}

.step50-template-preview__background {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.step50-template-field {
  position: absolute;
  color: #111;
  overflow: hidden;
  white-space: pre-wrap;
  line-height: 1.32;
  padding: 1px 3px;
  z-index: 2;
}

.step50-template-field--kana,
.step50-template-field--name,
.step50-template-field--gender,
.step50-template-field--birth,
.step50-template-field--birth-year,
.step50-template-field--birth-month,
.step50-template-field--birth-day,
.step50-template-field--birth-age,
.step50-template-field--education,
.step50-template-field--address,
.step50-template-field--phone,
.step50-template-field--email,
.step50-template-field--commute,
.step50-template-field--commute-from,
.step50-template-field--commute-to,
.step50-template-field--commute-minutes,
.step50-template-field--transportation,
.step50-template-field--job-title,
.step50-template-field--route,
.step50-template-field--health,
.step50-template-field--family,
.step50-template-field--awards {
  display: flex;
  align-items: center;
}

.step50-template-field--kana {
  left: 7.45%;
  top: 9.55%;
  width: 21.3%;
  height: 2.138%;
  font-size: 10px;
}

.step50-template-field--name {
  left: 7.25%;
  top: 13.08%;
  width: 21.9%;
  height: 4.25%;
  font-size: 20px;
  line-height: 1.15;
}

.step50-template-field--gender {
  left: 32.158%;
  top: 15.083%;
  width: 3.526%;
  height: 2.375%;
  font-size: 13px;
  text-align: center;
}

.step50-template-circle {
  position: absolute;
  border: 1.4px solid #111;
  border-radius: 999px;
  z-index: 3;
  pointer-events: none;
}

.step50-template-circle--gender-male {
  left: 30.77%;
  top: 12.58%;
  width: 1.55%;
  height: 2.22%;
}

.step50-template-circle--gender-female {
  left: 32.73%;
  top: 12.58%;
  width: 1.55%;
  height: 2.22%;
}

.step50-template-field--birth {
  left: 12.175%;
  top: 18.95%;
  width: 21.83%;
  height: 2.019%;
  font-size: 10px;
}

.step50-template-field--birth-year {
  left: 9.6%;
  top: 18.95%;
  width: 2.55%;
  height: 2.019%;
  font-size: 9px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--birth-month {
  left: 14.75%;
  top: 18.95%;
  width: 1.6%;
  height: 2.019%;
  font-size: 9px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--birth-day {
  left: 18.75%;
  top: 18.95%;
  width: 1.6%;
  height: 2.019%;
  font-size: 9px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--birth-age {
  left: 23.25%;
  top: 18.95%;
  width: 2.0%;
  height: 2.019%;
  font-size: 9px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--education {
  left: 10.915%;
  top: 21.52%;
  width: 32.746%;
  height: 1.663%;
  font-size: 9px;
}

.step50-template-photo {
  position: absolute;
  left: 38.02%;
  top: 9.3%;
  width: 7.34%;
  height: 13.78%;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: #777;
  font-size: 10px;
}

.step50-template-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.step50-template-field--address {
  left: 7.557%;
  top: 29.216%;
  width: 39.043%;
  height: 4.751%;
  font-size: 10px;
}

.step50-template-field--address-kana {
  left: 11.5%;
  top: 26.12%;
  width: 34.2%;
  height: 2%;
  font-size: 7.8px;
}

.step50-template-field--postal-code {
  left: 7.65%;
  top: 28.92%;
  width: 12%;
  height: 1.9%;
  font-size: 8.5px;
}

.step50-template-field--phone {
  left: 7.45%;
  top: 38.21%;
  width: 15.953%;
  height: 1.781%;
  font-size: 9px;
}

.step50-template-field--email {
  left: 26.7%;
  top: 38.21%;
  width: 18.472%;
  height: 1.781%;
  font-size: 8.5px;
}

.step50-template-field--commute {
  left: 12.594%;
  top: 40.66%;
  width: 20.151%;
  height: 1.663%;
  font-size: 8.5px;
}

.step50-template-field--commute-from {
  left: 11.65%;
  top: 40.36%;
  width: 5.9%;
  height: 1.85%;
  font-size: 8.5px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--commute-to {
  left: 24.9%;
  top: 40.36%;
  width: 5.5%;
  height: 1.85%;
  font-size: 8.5px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--commute-minutes {
  left: 39.65%;
  top: 40.36%;
  width: 3.3%;
  height: 1.85%;
  font-size: 8.5px;
  justify-content: flex-end;
  padding-right: 1px;
}

.step50-template-field--transportation {
  left: 11.251%;
  top: 42.92%;
  width: 22.67%;
  height: 1.9%;
  font-size: 8.5px;
}

.step50-template-field--job-title {
  left: 10.579%;
  top: 50.594%;
  width: 10.915%;
  height: 2.85%;
  font-size: 11px;
}

.step50-template-field--route {
  left: 26.868%;
  top: 52.019%;
  width: 16.793%;
  height: 2.138%;
  font-size: 9px;
}

.step50-template-field--motivation {
  left: 9.28%;
  top: 56.651%;
  width: 37.2%;
  height: 9.739%;
  background: #fff;
  font-size: 9px;
  line-height: 1.45;
}

.step50-template-field--strengths {
  left: 9.28%;
  top: 71.971%;
  width: 37.2%;
  height: 6.651%;
  background: #fff;
  font-size: 8.8px;
  line-height: 1.43;
}

.step50-template-field--pc-skills {
  left: 9.28%;
  top: 84.204%;
  width: 37.2%;
  height: 6.651%;
  background: #fff;
  font-size: 8.8px;
  line-height: 1.43;
}

.step50-template-work-field,
.step50-template-field--health,
.step50-template-field--family,
.step50-template-field--awards,
.step50-template-field--preferences,
.step50-template-field--referral {
  font-size: 8.2px;
  line-height: 1.38;
}

.step50-template-work-field {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.step50-template-field--work-period,
.step50-template-field--work-period-start,
.step50-template-field--work-period-end {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.step50-template-field--work-company {
  font-weight: 700;
  line-height: 1.25;
  padding-top: 5px;
}

.step50-template-field--work-content,
.step50-template-field--work-result {
  padding-top: 5px;
}

.step50-template-cover {
  position: absolute;
  background: #fff;
  display: none;
  z-index: 1;
}

.step50-template-cover--work-arrow-1 {
  left: 55.15%;
  top: 14.1%;
  width: 1.35%;
  height: 2.35%;
}

.step50-template-cover--work-arrow-2 {
  left: 55.15%;
  top: 21.28%;
  width: 1.35%;
  height: 2.35%;
}

.step50-template-cover--work-arrow-3 {
  left: 55.15%;
  top: 28.54%;
  width: 1.35%;
  height: 2.35%;
}

.step50-template-cover--work-arrow-4 {
  left: 55.15%;
  top: 35.66%;
  width: 1.35%;
  height: 2.35%;
}

.step50-template-cover--work-arrow-5 {
  left: 55.15%;
  top: 42.55%;
  width: 1.35%;
  height: 3.3%;
}

.step50-template-field--health {
  left: 62.75%;
  top: 63.58%;
  width: 28.2%;
  height: 2.1%;
}

.step50-template-field--family {
  left: 68.01%;
  top: 68.171%;
  width: 22.67%;
  height: 1.9%;
}

.step50-template-field--awards {
  left: 62.972%;
  top: 71.734%;
  width: 28.547%;
  height: 1.9%;
}

.step50-template-field--preferences {
  left: 66.331%;
  top: 76.485%;
  width: 26.868%;
  height: 5.701%;
}

.step50-template-field--referral {
  left: 62.972%;
  top: 86.58%;
  width: 30.227%;
  height: 4.157%;
}

.step50-template-check {
  position: absolute;
  display: grid;
  place-items: center;
  color: #111;
  font-size: 12px;
  line-height: 1;
  font-weight: 700;
}

.step50-template-check--hospital-no {
  left: 66.62%;
  top: 53.0%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--hospital-yes {
  left: 70.5%;
  top: 53.0%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-field--hospital-frequency {
  left: 82.92%;
  top: 52.7%;
  width: 1.8%;
  height: 1.9%;
  font-size: 8.2px;
  justify-content: flex-end;
}

.step50-template-check--smoking-no {
  left: 66.62%;
  top: 55.36%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--smoking-yes {
  left: 70.5%;
  top: 55.36%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-field--smoking-frequency {
  left: 82.92%;
  top: 55.15%;
  width: 1.8%;
  height: 1.9%;
  font-size: 8.2px;
  justify-content: flex-end;
}

.step50-template-check--dependent-no {
  left: 66.86%;
  top: 67.28%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--dependent-yes {
  left: 70.72%;
  top: 67.28%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-field--dependent-count {
  left: 79.05%;
  top: 67.45%;
  width: 3.2%;
  height: 1.9%;
  font-size: 8.2px;
}

.step50-template-check--spouse-no {
  left: 66.86%;
  top: 69.9%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--spouse-yes {
  left: 70.72%;
  top: 69.9%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--spouse-support-no {
  left: 84.94%;
  top: 69.9%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--spouse-support-yes {
  left: 88.18%;
  top: 69.9%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--route-hellowork {
  left: 21.1%;
  top: 50.92%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--route-homepage {
  left: 27.05%;
  top: 50.92%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--route-paper {
  left: 31.65%;
  top: 50.92%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--route-referral {
  left: 36.05%;
  top: 50.92%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--transportation-jr {
  left: 6.75%;
  top: 43.1%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--transportation-private {
  left: 9.28%;
  top: 43.1%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--transportation-bus {
  left: 11.85%;
  top: 43.1%;
  width: 1.1%;
  height: 1.5%;
}

.step50-template-check--transportation-other {
  left: 14.35%;
  top: 43.1%;
  width: 1.1%;
  height: 1.5%;
}

.step50-preview-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: var(--step50-surface);
  border: 1px solid var(--step50-line);
  border-radius: 8px;
  padding: 12px 14px;
  margin-bottom: 14px;
}

.step50-preview-toolbar p {
  color: var(--step50-muted);
  margin-bottom: 0;
}

.step50-preview__page {
  background: #ffffff;
  color: #111;
  border: 1px solid #111;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  width: 1120px;
  max-width: none;
  padding: 20px;
  font-size: 13px;
  line-height: 1.45;
}

.step50-preview__heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 84px;
  gap: 12px;
  align-items: start;
  margin-bottom: 8px;
}

.step50-preview__heading h3 {
  margin: 0;
}

.step50-preview__photo {
  display: grid;
  place-items: center;
  width: 84px;
  height: 112px;
  border: 1px solid #111;
  background: #fff;
  color: #777;
  font-size: 0.86em;
  overflow: hidden;
}

.step50-preview__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.step50-preview__box,
.step50-preview__section {
  border: 1px solid #111;
  padding: 8px 10px;
  min-height: 38px;
  margin-bottom: 8px;
}

.step50-preview__name {
  min-height: 64px;
}

.step50-preview__section {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  padding: 0;
}

.step50-preview__section strong {
  display: grid;
  place-items: center;
  padding: 8px;
  border-right: 1px solid #111;
  text-align: center;
}

.step50-preview__section p {
  margin: 0;
  padding: 8px;
  white-space: pre-wrap;
}

.step50-preview__work-history {
  border: 1px solid #111;
  margin-bottom: 8px;
}

.step50-preview__work-header {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr) minmax(0, 1fr);
  border-bottom: 1px solid #111;
  background: #f4f4f4;
}

.step50-preview__work-header strong {
  display: grid;
  place-items: center;
  min-height: 32px;
  padding: 6px 8px;
  text-align: center;
  font-weight: 700;
}

.step50-preview__work-header strong + strong {
  border-left: 1px solid #111;
}

.step50-preview__work-row {
  display: grid;
  grid-template-columns: 105px minmax(0, 1fr) minmax(0, 1fr);
  min-height: 86px;
}

.step50-preview__work-row + .step50-preview__work-row {
  border-top: 1px solid #111;
}

.step50-preview__work-row strong,
.step50-preview__work-row p {
  margin: 0;
  padding: 8px;
  white-space: pre-wrap;
}

.step50-preview__work-row strong {
  display: grid;
  place-items: center;
  text-align: center;
  border-right: 1px solid #111;
  font-weight: 700;
}

.step50-preview__work-row p:first-of-type {
  border-right: 1px solid #111;
}

.step50-preview__empty {
  margin: 0;
  padding: 8px;
}

@media (max-width: 900px) {
  .step50-resume-ai__header,
  .step50-resume-ai-link-card,
  .step50-resume-ai__split,
  .step50-grid--three {
    display: block;
  }

  .step50-resume-ai__actions {
    justify-content: stretch;
    margin-top: 10px;
  }

  .step50-resume-ai__header .step50-button {
    width: 100%;
  }

  .step50-resume-ai-link-card__button {
    width: 100%;
    margin-top: 12px;
  }

  .step50-resume-ai-guide__actions {
    display: block;
  }

  .step50-card,
  .step50-grid--three > .step50-card {
    margin-bottom: 12px;
  }

  .step50-form fieldset {
    grid-template-columns: 1fr;
  }

  .step50-work-history__item {
    grid-template-columns: 1fr;
  }

  .step50-work-history__period {
    grid-template-columns: 1fr;
  }

  .step50-photo-editor {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .step50-resume-ai {
    padding: 14px;
  }

  .step50-resume-ai-guide {
    padding: 16px;
  }

  .step50-resume-ai-guide__step {
    grid-template-columns: 34px minmax(0, 1fr);
    padding: 12px;
  }

  .step50-resume-ai-guide__step span {
    width: 32px;
    height: 32px;
  }

  .step50-resume-ai__tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .step50-resume-ai__tabs button {
    width: 100%;
  }

  .step50-preview {
    padding: 10px;
  }

  .step50-preview__page {
    padding: 12px;
  }
}

@media print {
  body * {
    visibility: hidden;
  }

  .step50-resume-ai,
  .step50-resume-ai *,
  .step50-preview,
  .step50-preview * {
    visibility: visible;
  }

  .step50-resume-ai {
    border: 0 !important;
    background: #fff !important;
    padding: 0 !important;
  }

  .step50-resume-ai__header,
  .step50-resume-ai__tabs,
  .step50-resume-ai__sample,
  .step50-resume-ai__notice,
  .step50-resume-ai__limits,
  .step50-preview-toolbar,
  .step50-view:not([data-view-panel="preview"]) {
    display: none !important;
  }

  .step50-view[data-view-panel="preview"] {
    display: block !important;
  }

  .step50-preview {
    border: 0 !important;
    background: #fff !important;
    padding: 0 !important;
  }

  .step50-preview__page {
    border: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    width: auto;
    max-width: none;
    padding: 0;
    font-size: 10.5px;
  }

  .step50-template-preview__page {
    width: 390mm;
  }

  @page {
    size: A3 landscape;
    margin: 10mm;
  }
}
