.environment-banner { min-height:26px; padding:4px 12px; background:#fff1e6; color:#87441f; font-size:.7rem; font-weight:700; letter-spacing:0; }
.intro { padding:26px 0 30px; }
.intro h1 { font-size:clamp(1.65rem,3vw,2.2rem); line-height:1.16; letter-spacing:-.035em; max-width:none; margin:0 0 12px; }
.lede { font-size:.96rem; line-height:1.55; max-width:860px; }
.work-area { margin-top:20px; }
.brand { gap:12px; }
.official-logo { display:block; width:154px; height:auto; object-fit:contain; }
.brand > small { font-size:.75rem; color:var(--muted); }
#draft-notice { padding:12px; background:#fff4e8; border-left:3px solid var(--orange); }
.company-context { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; padding:22px 24px; background:#fff; border:1px solid var(--line); border-radius:16px; }
#company-details summary { cursor:pointer; color:#226575; font-weight:650; }
#company-details { grid-column:1 / -1; }
.company-data-heading { grid-column:1; grid-row:1; }
.company-context #plan-summary { grid-column:2; grid-row:1; }
#company-form { margin-top:16px; }
#company-form .field-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
#company-form h3 { margin:20px 0 10px; }
#company-form input[readonly] { background:#edf4f8; }
.portal-footer,.portal-footer nav { display:flex; align-items:center; flex-wrap:wrap; gap:22px; justify-content:space-between; }
.portal-footer a { display:inline-flex; align-items:center; gap:7px; color:inherit; }
.portal-footer svg { width:21px; height:21px; }
.company-context strong { display:block; color:var(--ink); font-size:1.1rem; }
.context-label { display:block; font-size:.78rem; color:var(--muted); margin-bottom:5px; }
#plan-summary { padding-left:22px; border-left:3px solid var(--cyan); }
#plan-summary p { margin:5px 0; font-size:.91rem; }
#plan-summary small { color:var(--muted); font-size:.76rem; }
.next-steps { margin:14px 0 0; padding:12px 18px; background:#edf4f8; border-radius:12px; }
.next-steps summary { cursor:pointer; font-weight:750; font-size:.86rem; }
.next-steps ol { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; padding-left:24px; margin:16px 0 6px; }
.next-steps b,.next-steps span { display:block; font-size:.84rem; }
.next-steps span { color:var(--muted); margin-top:4px; }
.portal-vacancy { padding:18px; border:1px solid var(--line); border-radius:12px; margin-top:12px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.portal-vacancy h3 { margin:0 0 5px; font-size:1rem; color:var(--ink); }
.portal-vacancy p { margin:5px 0; font-size:.83rem; color:var(--muted); }
.vacancy-actions,.result-actions { display:flex; flex-wrap:wrap; gap:8px; }
.vacancy-actions { justify-content:flex-end; flex-shrink:0; max-width:44%; }
.status-badge { display:inline-block; padding:4px 9px; border-radius:20px; background:#eaf5f4; color:#25615b; font-size:.76rem; font-weight:750; }
.empty-state { padding:18px; text-align:center; border:1px dashed #c6d6e2; border-radius:12px; background:#f8fbfd; }
.empty-state h3 { margin:0 0 5px; }
.empty-state p { margin:0; color:var(--muted); }
.completion-hint { font-size:.76rem!important; }
#plan-action-message:empty { display:none; }
#plan-action-message { font-size:.85rem; color:#216443; margin-bottom:0; }
.vacancy-card { border:2px solid #c7d8e5; margin:20px 0; box-shadow:0 3px 10px #10223508; scroll-margin-top:86px; }
.vacancy-card-head { align-items:center; background:#f1f7fb; padding:14px 18px; gap:12px; }
.card-toggle { display:flex; align-items:center; gap:12px; flex:1; min-width:0; cursor:pointer; color:inherit; font:inherit; padding:0; border:0; background:none; text-align:left; }
.vacancy-number { min-width:90px; height:auto; min-height:32px; flex-shrink:0; margin:0; padding:6px; }
.vacancy-name { display:block; font-size:1rem; overflow-wrap:anywhere; }
.card-description { display:block; margin-top:4px; font-size:.8rem; color:var(--muted); }
.card-progress { color:#6b5a37; font-size:.76rem; white-space:nowrap; background:#fff3d7; border-radius:20px; padding:5px 9px; font-weight:750; }
.card-progress.complete { background:#e6f6ed; color:#216443; }
.card-actions { display:flex; justify-content:flex-end; gap:18px; padding:10px 18px; border-bottom:1px solid var(--line); }
.card-actions .text-button { color:#335b77; min-height:28px; }
.collapsed .card-actions { border-bottom:0; }
.vacancy-fields { padding:22px; }
.field-grid { align-items:start; gap:20px 18px; }
.additional-fields { margin-top:22px; }
.field-help,.optional { font-size:.75rem; line-height:1.45; font-weight:400; color:var(--muted); }
.application-fields { padding:16px; margin:22px 0; border:1px solid var(--line); border-radius:12px; }
.application-fields legend { padding:0 6px; font-size:.86rem; font-weight:750; }
.attachment-field { border:1px dashed #c1d1dd; padding:16px; border-radius:12px; }
.attachment-field input { max-width:100%; min-width:0; font-size:.82rem; }
.existing-attachment { color:var(--muted); font-size:.75rem; }
.card-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }
.editor-toolbar { position:sticky; bottom:0; z-index:5; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; padding:14px 0; background:rgba(255,255,255,.97); border-top:1px solid var(--line); }
.card-error { color:var(--red); font-size:.85rem; }
.new-card { animation:new-vacancy 1.8s ease-out; }
@keyframes new-vacancy { 0%,40% {border-color:var(--orange); box-shadow:0 0 0 5px #ef6c2228;} 100% {border-color:#c7d8e5; box-shadow:none;} }
.review-row { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:16px; border:1px solid #ecd3be; background:#fff; border-radius:12px; margin:12px 0; }
.review-row p { margin:4px 0 0; font-size:.85rem; color:var(--muted); }
.success-mark { width:44px; height:44px; display:grid; place-items:center; background:#dff4e9; color:#216443; font-size:1.5rem; border-radius:50%; margin-bottom:12px; }
.result h2 { font-size:1.75rem; }
.result-actions { margin:22px 0 16px; }
#result-names { padding-left:22px; }
#result-names li { padding:5px 0; font-weight:650; }
.toast { position:fixed; z-index:30; bottom:22px; left:50%; transform:translateX(-50%); max-width:calc(100% - 24px); width:max-content; padding:12px 20px; border-radius:12px; color:#fff; background:#183d40; box-shadow:var(--shadow); font-size:.91rem; font-weight:650; pointer-events:none; }
#my-vacancies,#summary-panel,#result,#vacancies-panel { scroll-margin-top:90px; }
button:focus-visible,summary:focus-visible { outline:3px solid var(--cyan); outline-offset:3px; }
button:disabled { opacity:.55; cursor:wait; transform:none; }
dialog { width:min(500px,calc(100% - 28px)); border:1px solid var(--line); border-radius:18px; padding:26px; color:var(--ink); }
dialog::backdrop { background:#10223599; }
#close-error { color:var(--red); font-size:.86rem; }
@media(max-width:760px) {
  #company-form .field-grid { grid-template-columns:1fr; }
  .company-context #plan-summary { grid-column:1; grid-row:auto; }
  .intro { padding:20px 0; } .intro h1 { font-size:1.65rem; } .lede { font-size:.9rem; }
  .company-context { grid-template-columns:1fr; gap:16px; padding:18px; }
  #plan-summary { padding-left:14px; }
  .next-steps ol { grid-template-columns:1fr; gap:14px; }
  .portal-vacancy { flex-direction:column; align-items:stretch; gap:14px; padding:15px; }
  .vacancy-actions { justify-content:flex-start; max-width:none; }
  .vacancy-card-head { flex-wrap:wrap; padding:12px; }
  .card-toggle { align-items:flex-start; flex-basis:100%; gap:8px; }
  .vacancy-number { min-width:78px; } .vacancy-name { font-size:.92rem; }
  .vacancy-fields { padding:15px; }
  .card-progress { margin-left:86px; }
  .card-bottom { flex-direction:column; align-items:stretch; }
  .card-bottom .btn { width:100%; }
  .editor-toolbar .btn { flex:1 1 140px; padding:10px; font-size:.8rem; }
  .review-row { padding:12px; align-items:flex-start; }
  .toast { bottom:12px; font-size:.82rem; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none!important; scroll-behavior:auto!important; transition:none!important; } }