* { box-sizing: border-box; }
body { margin: 0; background: var(--pk-bg, #fff); color: var(--pk-text, #202020); font-family: system-ui, sans-serif; letter-spacing: 0; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }
a { color: inherit; text-underline-offset: 3px; }
.career-container { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }
.career-intro { border-bottom: 1px solid var(--pk-line, #ddd); }
.intro-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding-block: 28px; }
.intro-inner > div:first-child { max-width: 760px; }
.eyebrow, .detail-kicker { margin: 0 0 8px; color: var(--pk-accent, #b91c24); font-size: 14px; font-weight: 700; }
.intro-inner h1 { margin: 0 0 10px; font-size: 32px; line-height: 1.4; }
.intro-inner p:last-child { margin: 0; color: var(--pk-muted, #626262); font-size: 18px; line-height: 1.8; }
.intro-stat { flex: 0 0 150px; border-left: 1px solid var(--pk-line, #ddd); padding-left: 24px; }
.intro-stat strong { display: block; font-size: 32px; line-height: 1.4; }
.intro-stat span { display: block; font-size: 14px; color: var(--pk-muted, #626262); }
.career-toolbar { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 14px; padding-block: 20px; border-bottom: 1px solid var(--pk-line, #ddd); }
.career-toolbar label, .form-grid label { display: grid; gap: 7px; min-width: 0; }
.career-toolbar label > span, .form-grid label > span { color: var(--pk-muted, #626262); font-size: 14px; font-weight: 600; }
.career-toolbar input, .career-toolbar select, .application-form input, .application-form select, .application-form textarea { min-width: 0; width: 100%; min-height: 44px; border: 1px solid var(--pk-line, #ddd); border-radius: 4px; padding: 10px 12px; background: var(--pk-surface, #f5f5f5); color: var(--pk-text, #202020); }
:where(a, button, input, select, textarea):focus-visible { outline: 2px solid var(--pk-accent, #b91c24); outline-offset: 3px; }
.career-workspace { display: grid; grid-template-columns: 340px minmax(0, 1fr); min-height: 440px; }
.job-list-panel { border-right: 1px solid var(--pk-line, #ddd); min-width: 0; }
.panel-heading { min-height: 62px; padding: 16px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid var(--pk-line, #ddd); }
.panel-heading h2 { font-size: 16px; margin: 0; }
.panel-heading span { font-size: 14px; color: var(--pk-muted, #626262); }
.job-list { display: flex; flex-direction: column; }
.job-card { appearance: none; width: 100%; text-align: left; border: 0; border-bottom: 1px solid var(--pk-line, #ddd); border-left: 3px solid transparent; background: transparent; padding: 18px 16px; cursor: pointer; color: inherit; overflow-wrap: anywhere; }
.job-card:hover, .job-card.active { background: var(--pk-surface, #f5f5f5); }
.job-card.active { border-left-color: var(--pk-accent, #b91c24); }
.job-card h3 { font-size: 16px; line-height: 1.5; margin: 0 0 8px; }
.job-card p { margin: 0 0 10px; color: var(--pk-muted, #626262); font-size: 16px; }
.job-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; font-size: 14px; color: var(--pk-muted, #626262); }
.job-detail-panel { padding: 28px; min-width: 0; overflow-wrap: anywhere; scroll-margin-top: 180px; }
.empty-detail { min-height: 260px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; color: var(--pk-muted, #626262); }
.empty-detail img { width: 66px; height: auto; margin-bottom: 16px; }
.job-detail-panel h2 { color: var(--pk-text, #202020); font-size: 25px; line-height: 1.4; margin: 0 0 14px; }
.empty-detail p { margin: 0; font-size: 18px; line-height: 1.7; }
.detail-summary { font-size: 18px; line-height: 1.8; color: var(--pk-muted, #626262); margin-block: 20px; }
.detail-facts { display: flex; flex-wrap: wrap; gap: 8px 16px; padding-bottom: 18px; border-bottom: 1px solid var(--pk-line, #ddd); }
.detail-facts span { font-size: 14px; color: var(--pk-muted, #626262); }
.detail-section { margin-top: 24px; }
.detail-section h3 { font-size: 16px; margin: 0 0 10px; }
.detail-section ul { margin: 0; padding-left: 20px; color: var(--pk-muted, #626262); font-size: 18px; line-height: 1.8; }
.detail-section li + li { margin-top: 6px; }
.apply-bar { margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--pk-line, #ddd); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.apply-bar p { margin: 0; color: var(--pk-muted, #626262); font-size: 14px; line-height: 1.6; }
.primary-button, .submit-row button { flex-shrink: 0; min-height: 44px; border: 0; border-radius: 4px; background: var(--pk-accent, #b91c24); color: #fff; font-weight: 700; font-size: 16px; padding: 12px 18px; cursor: pointer; }
.primary-button:hover, .submit-row button:hover { filter: brightness(.9); }
:root[data-theme="dark"] .primary-button, :root[data-theme="dark"] .submit-row button { color: var(--pk-bg, #17191b); }
.loading-state, .career-empty { padding: 36px 20px; text-align: center; color: var(--pk-muted, #626262); font-size: 18px; line-height: 1.7; }
.loading-state span { display: block; width: 26px; height: 26px; border: 3px solid var(--pk-line, #ddd); border-top-color: var(--pk-accent, #b91c24); border-radius: 50%; margin: 0 auto 14px; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.apply-dialog { width: min(840px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--pk-line, #ddd); border-radius: 8px; background: var(--pk-bg, #fff); color: var(--pk-text, #202020); }
.apply-dialog::backdrop { background: rgb(0 0 0 / .65); }
.application-form { padding: 0; }
.dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 20px 24px; border-bottom: 1px solid var(--pk-line, #ddd); position: sticky; top: 0; background: var(--pk-bg, #fff); z-index: 2; }
.dialog-head > div { min-width: 0; overflow-wrap: anywhere; }
.dialog-head p { font-size: 14px; font-weight: 700; color: var(--pk-accent, #b91c24); margin: 0 0 6px; }
.dialog-head h2 { font-size: 22px; line-height: 1.4; margin: 0 0 6px; }
.dialog-head span { font-size: 16px; color: var(--pk-muted, #626262); }
.icon-button { flex: 0 0 44px; width: 44px; height: 44px; border: 1px solid var(--pk-line, #ddd); background: var(--pk-surface, #f5f5f5); border-radius: 4px; font-size: 25px; cursor: pointer; color: inherit; }
.form-section { padding: 22px 24px 0; }
.form-section h3 { font-size: 18px; margin: 0 0 14px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.form-grid .span-2 { grid-column: 1 / -1; }
.application-form textarea { resize: vertical; line-height: 1.6; }
.resume-picker { display: block; border: 1px dashed var(--pk-muted, #626262); border-radius: 4px; padding: 18px; text-align: center; cursor: pointer; overflow-wrap: anywhere; }
.resume-picker strong, .resume-picker span { display: block; }
.resume-picker span { font-size: 14px; color: var(--pk-muted, #626262); margin-top: 6px; }
.resume-picker input { position: absolute; width: 1px; height: 1px; min-height: 0; opacity: 0; pointer-events: none; }
.resume-picker:focus-within { outline: 2px solid var(--pk-accent, #b91c24); outline-offset: 3px; }
.consent-row { margin: 22px 24px 0; display: flex; align-items: flex-start; gap: 10px; color: var(--pk-muted, #626262); font-size: 16px; line-height: 1.7; }
.consent-row input { width: 18px; height: 18px; min-height: 18px; flex: 0 0 auto; margin-top: 3px; accent-color: var(--pk-accent, #b91c24); }
.submit-row { padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.submit-row p { margin: 0; font-size: 16px; line-height: 1.7; color: var(--pk-muted, #626262); overflow-wrap: anywhere; }
.submit-row p.error { color: var(--pk-accent, #b91c24); }
.submit-row p.success { color: var(--pk-text, #202020); }
.submit-row button:disabled { opacity: .6; cursor: wait; }
.trap-field { position: absolute !important; left: -9999px !important; }
.career-footer { margin-top: 32px; border-top: 1px solid var(--pk-line, #ddd); }
.footer-inner { padding-block: 24px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.footer-inner img { width: 170px; max-width: 100%; height: auto; }
.footer-inner p { font-size: 14px; line-height: 1.7; color: var(--pk-muted, #626262); margin: 8px 0 0; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; align-content: start; gap: 12px 20px; }
.footer-links a { font-size: 16px; padding-block: 5px; }
.publisher { grid-column: 1 / -1; padding-top: 14px; border-top: 1px solid var(--pk-line, #ddd); }
@media (max-width: 820px) {
  .career-container { width: calc(100% - 32px); }
  .career-toolbar { grid-template-columns: 1fr 1fr; }
  .career-toolbar label:first-child { grid-column: 1 / -1; }
  .career-workspace { display: block; }
  .job-list-panel { border-right: 0; }
  .job-list { max-height: 340px; overflow: auto; }
  .job-detail-panel { padding: 24px 0; }
}
@media (max-width: 560px) {
  .intro-inner { display: block; padding-block: 24px; }
  .intro-inner h1 { font-size: 27px; }
  .intro-stat { display: flex; align-items: center; gap: 12px; border: 0; padding: 16px 0 0; }
  .intro-stat strong { font-size: 26px; }
  .career-toolbar { gap: 12px; }
  .career-toolbar select { font-size: 16px; padding-inline: 8px; }
  .job-detail-panel h2 { font-size: 23px; }
  .apply-bar, .submit-row { align-items: stretch; flex-direction: column; }
  .apply-dialog { width: calc(100% - 16px); max-height: calc(100dvh - 16px); }
  .dialog-head { padding: 16px; }
  .dialog-head h2 { font-size: 20px; }
  .form-section { padding: 20px 16px 0; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid .span-2 { grid-column: auto; }
  .consent-row { margin: 20px 16px 0; }
  .submit-row { padding: 20px 16px; }
  .footer-inner { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) { .loading-state span { animation: none; } }
