/* Local Inter WOFF2 font files. */
@font-face { font-family:"Inter"; font-style:normal; font-weight:400; font-display:swap; src:url("./assets/fonts/Inter-Regular.woff2") format("woff2"); }
@font-face { font-family:"Inter"; font-style:normal; font-weight:500; font-display:swap; src:url("./assets/fonts/Inter-Medium.woff2") format("woff2"); }
@font-face { font-family:"Inter"; font-style:normal; font-weight:600; font-display:swap; src:url("./assets/fonts/Inter-SemiBold.woff2") format("woff2"); }
@font-face { font-family:"Inter"; font-style:normal; font-weight:700; font-display:swap; src:url("./assets/fonts/Inter-Bold.woff2") format("woff2"); }
@font-face { font-family:"Inter"; font-style:normal; font-weight:800; font-display:swap; src:url("./assets/fonts/Inter-ExtraBold.woff2") format("woff2"); }
    *{box-sizing:border-box}
    :root{
      color-scheme:dark;
      --bg:#0e1621;--panel:#17212b;--card:#182533;--field:#202b36;--field2:#242f3d;
      --out:#2b5278;--out2:#315f8a;--accent:#54a9eb;--accent2:#79c2ff;
      --text:#f5f7fa;--muted:#9cb0c2;--line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);
      --green:#63c37d;--warn:#e4b25f;--danger:#ef6a70;
      --warnbg:rgba(196,122,67,.15);--dangerbg:rgba(239,106,112,.12);--greenbg:rgba(99,195,125,.12);
      --pad:clamp(.7rem,2.4vw,1.45rem);
      --c1:#54a9eb;--c2:#8c9cff;--c3:#e4b25f;--c4:#63c37d;--c5:#ef6a70;--c6:#c384e8;
    }
    html{min-width:20rem;background:var(--bg);-webkit-text-size-adjust:100%}
    body{min-height:100vh;min-height:100dvh;margin:0;overflow-x:hidden;color:var(--text);background-color:var(--bg);background-image:radial-gradient(circle at 15% 20%,rgba(84,169,235,.035) 0 1px,transparent 1px),radial-gradient(circle at 70% 60%,rgba(255,255,255,.025) 0 1px,transparent 1px);background-size:3.5rem 3.5rem,4.5rem 4.5rem;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
    button,input,select,textarea{font:inherit}
    button{-webkit-tap-highlight-color:transparent}
    main{width:min(100%,82rem);margin:0 auto;padding:var(--pad)}
    header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:calc(var(--pad)*-1) calc(var(--pad)*-1) 1rem;padding:.85rem var(--pad);border-bottom:1px solid var(--line);background:rgba(23,33,43,.96);box-shadow:0 .4rem 1.2rem rgba(0,0,0,.14);backdrop-filter:blur(.75rem)}
    header>div:first-child{min-width:0}
    h1{margin:0;font-size:clamp(1.22rem,3.2vw,1.75rem);line-height:1.15;letter-spacing:-.035em;font-weight:800}
    .sub{max-width:58rem;margin:.35rem 0 0;color:var(--muted);font-size:clamp(.74rem,1.35vw,.84rem);line-height:1.45}
    .header-actions{display:flex;align-items:center;gap:.5rem;flex:0 0 auto}
    .lang-switch{display:grid;grid-template-columns:1fr 1fr;gap:.25rem;padding:.2rem;border:1px solid var(--line);border-radius:.65rem;background:var(--field)}
    .lang-btn{min-width:2.7rem;min-height:2.2rem;border:0;border-radius:.48rem;padding:.35rem .55rem;color:var(--muted);background:transparent;font-weight:800;font-size:.72rem;cursor:pointer}
    .lang-btn.active{color:#fff;background:var(--out)}
    .layout{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(20rem,.72fr);gap:.9rem;align-items:start}
    .card{min-width:0;padding:.8rem;overflow:hidden;border:1px solid var(--line);border-radius:.9rem;background:var(--panel);box-shadow:0 1rem 2.5rem rgba(0,0,0,.22)}
    aside.card{position:sticky;top:6rem;max-height:calc(100dvh - 7rem);overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
    .form{display:grid;gap:.65rem}
    .group{min-width:0;padding:.85rem;border:1px solid var(--line);border-radius:.8rem;background:var(--card)}
    .group h2,.aside-title{margin:0 0 .75rem;color:var(--accent2);font-size:.88rem;font-weight:700;line-height:1.25}
    .group-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem;margin-bottom:.7rem}
    .group-title-row h2{margin:0}
    .fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
    .fields.three{grid-template-columns:repeat(3,minmax(0,1fr))}
    .field-full{grid-column:1/-1}
    label{min-width:0;display:grid;align-content:start;gap:.32rem;color:var(--text);font-size:.75rem;font-weight:600;line-height:1.35}
    input,select,textarea{width:100%;min-width:0;border:1px solid var(--line2);border-radius:.58rem;outline:none;padding:.62rem .72rem;color:var(--text);background:var(--field);transition:.16s}
    input,select{min-height:2.65rem}
    textarea{min-height:5rem;resize:vertical;line-height:1.45}
    input:hover,select:hover,textarea:hover{background:var(--field2)}
    input:focus,select:focus,textarea:focus{border-color:var(--accent);background:var(--field);box-shadow:0 0 0 2px rgba(84,169,235,.18)}
    input[aria-invalid="true"],select[aria-invalid="true"]{border-color:var(--danger);box-shadow:0 0 0 2px rgba(239,106,112,.14)}
    input::placeholder,textarea::placeholder{color:#71879a;opacity:1}
    select option{color:var(--text);background:var(--panel)}
    .money-input{display:grid;grid-template-columns:minmax(0,1fr) 5.1rem;gap:.35rem}
    .hint{color:var(--muted);font-size:.66rem;font-weight:400;line-height:1.42}
    .formula,.note,.computed,.row-cost{margin-top:.62rem;padding:.62rem .7rem;border:1px solid rgba(84,169,235,.16);border-radius:.65rem;color:#c8d8e5;background:rgba(43,82,120,.32);font-size:.69rem;line-height:1.45}
    .note{border-color:var(--line);color:var(--muted);background:rgba(255,255,255,.035)}
    .note.warn,.validation.warn{border-color:rgba(228,178,95,.4);color:#f3d59e;background:var(--warnbg)}
    .note.good{border-color:rgba(99,195,125,.34);color:#bde9c8;background:var(--greenbg)}
    .computed strong,.formula strong,.note strong,.row-cost strong{color:var(--text)}
    .mode-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem;margin-bottom:.65rem}
    .mode-btn{min-height:2.45rem;border:1px solid var(--line);border-radius:.55rem;padding:.5rem .65rem;color:var(--muted);background:var(--field);font-size:.72rem;font-weight:700;cursor:pointer}
    .mode-btn.active{color:#fff;border-color:rgba(84,169,235,.45);background:var(--out)}
    .toggle{display:flex;align-items:flex-start;gap:.55rem;color:var(--text);font-size:.72rem;font-weight:600;line-height:1.4}
    .toggle input{width:1.05rem;min-height:1.05rem;height:1.05rem;margin:.12rem 0 0;accent-color:var(--accent);box-shadow:none}
    .dynamic-list{display:grid;gap:.55rem}
    .dynamic-row{min-width:0;padding:.65rem;border:1px solid var(--line);border-radius:.72rem;background:rgba(255,255,255,.025)}
    .row-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.55rem;color:#dce7ef;font-size:.71rem;font-weight:700}
    .row-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
    .row-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
    .row-grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
    .remove-btn{min-height:2rem;border:0;border-radius:.48rem;padding:.35rem .55rem;color:#ffc4c7;background:var(--dangerbg);font-size:.65rem;font-weight:700;cursor:pointer}
    .toolbar{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.55rem}
    button{border:0;border-radius:.58rem;padding:.62rem .78rem;color:#fff;background:var(--accent);font-weight:750;font-size:.72rem;cursor:pointer;transition:.16s}
    button:hover{background:var(--accent2)}
    button.secondary{color:var(--text);background:var(--field2)}
    button.secondary:hover{background:#2b3948}
    button.danger{color:#ffc4c7;background:var(--dangerbg)}
    button:focus-visible,.lang-btn:focus-visible,.mode-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
    .results{display:grid;gap:.2rem}
    .result{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;padding:.62rem 0;border-bottom:1px solid var(--line);align-items:start}
    .result span{color:#d9e4ec;font-size:.75rem;font-weight:600}
    .result strong{color:#fff;font-size:.78rem;text-align:right;white-space:nowrap}
    .result small{grid-column:1/-1;color:var(--muted);font-size:.64rem;line-height:1.35;margin-top:-.15rem}
    .result.negative strong{color:#bde9c8}
    .total{margin-top:.75rem;padding:.85rem;border:1px solid rgba(84,169,235,.3);border-radius:.8rem;background:linear-gradient(145deg,#284963,#2b5278)}
    .total-row{display:flex;justify-content:space-between;gap:.8rem;align-items:flex-start}
    .total-row span{color:#d8e7f3;font-size:.74rem}
    .total-row strong{font-size:clamp(1.45rem,4vw,2rem);line-height:1;letter-spacing:-.055em;text-align:right}
    .run-rate{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin-top:.7rem;padding-top:.7rem;border-top:1px solid rgba(255,255,255,.16)}
    .rate{min-width:0;padding:.48rem;border-radius:.55rem;background:rgba(0,0,0,.12)}
    .rate span{display:block;color:#b9ccda;font-size:.59rem;line-height:1.25}
    .rate b{display:block;margin-top:.2rem;overflow-wrap:anywhere;font-size:.72rem}
    .wait-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin-top:.65rem}
    .wait-card{padding:.55rem;border:1px solid var(--line);border-radius:.6rem;background:rgba(255,255,255,.025)}
    .wait-card span{display:block;color:var(--muted);font-size:.6rem}
    .wait-card strong{display:block;margin-top:.2rem;font-size:.73rem;overflow-wrap:anywhere}
    .chart-wrap{display:grid;grid-template-columns:8.5rem minmax(0,1fr);gap:.8rem;align-items:center;margin-top:.75rem;padding:.75rem;border:1px solid var(--line);border-radius:.78rem;background:rgba(255,255,255,.025)}
    .donut{position:relative;width:8.5rem;aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px var(--line),0 .55rem 1.25rem rgba(0,0,0,.18)}
    .donut::after{content:"";position:absolute;inset:1.72rem;border-radius:50%;background:var(--panel);box-shadow:0 0 0 1px var(--line),0 0 1rem rgba(0,0,0,.16)}
    .legend{display:grid;gap:.42rem;min-width:0}
    .legend-item{display:grid;grid-template-columns:.65rem minmax(0,1fr) auto;gap:.42rem;align-items:center;font-size:.64rem}
    .dot{width:.58rem;height:.58rem;border-radius:50%}
    .legend-item span:nth-child(2){color:#d8e4ec;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .legend-item b{color:#fff;font-size:.63rem;white-space:nowrap;text-align:right}
    .chart-note{min-height:.95rem;margin:.42rem .15rem 0;color:var(--muted);font-size:.61rem;line-height:1.4}
    .holiday-summary{margin-top:.28rem;color:var(--muted);font-size:.63rem;line-height:1.4}
    .decision{margin-top:.7rem;padding:.72rem;border:1px solid rgba(99,195,125,.28);border-radius:.72rem;background:var(--greenbg)}
    .decision h3{margin:0 0 .45rem;color:#bde9c8;font-size:.76rem}
    .decision-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.42rem}
    .decision-item{padding:.5rem;border-radius:.55rem;background:rgba(0,0,0,.12)}
    .decision-item span{display:block;color:#b9ccda;font-size:.59rem}
    .decision-item b{display:block;margin-top:.18rem;font-size:.73rem;overflow-wrap:anywhere}
    .scenario-box{margin-bottom:.75rem;padding:.75rem;border:1px solid var(--line);border-radius:.75rem;background:rgba(255,255,255,.025)}
    .scenario-box h2{margin:0 0 .55rem;color:var(--accent2);font-size:.8rem}
    .scenario-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.42rem;margin-top:.42rem}
    .scenario-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.42rem;margin-top:.42rem}
    .scenario-transfer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.42rem;margin-top:.42rem}
    .scenario-meta{margin-top:.42rem;color:var(--muted);font-size:.63rem;line-height:1.4}
    .validation{display:none;margin-top:.65rem;padding:.65rem;border:1px solid var(--line);border-radius:.66rem;font-size:.67rem;line-height:1.45}
    .validation.show{display:block}
    .validation.error{border-color:rgba(239,106,112,.4);color:#ffc4c7;background:var(--dangerbg)}
    .validation ul{margin:.35rem 0 0;padding-left:1.1rem}
    .quality{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.65rem;padding:.58rem .65rem;border:1px solid var(--line);border-radius:.62rem;background:rgba(255,255,255,.025)}
    .quality span{color:var(--muted);font-size:.65rem}
    .quality b{font-size:.7rem}
    .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem;margin-top:.7rem}
    .muted-line{margin:.6rem 0 0;color:var(--muted);font-size:.62rem;line-height:1.4}
    .hidden{display:none!important}
    .sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
    .toast{position:fixed;right:1rem;bottom:1rem;z-index:100;max-width:min(22rem,calc(100vw - 2rem));padding:.7rem .85rem;border:1px solid var(--line2);border-radius:.7rem;color:#fff;background:#202b36;box-shadow:0 .8rem 2rem rgba(0,0,0,.35);font-size:.72rem;opacity:0;transform:translateY(.5rem);pointer-events:none;transition:.2s}
    .toast.show{opacity:1;transform:none}
    @media(max-width:980px){.layout{grid-template-columns:1fr}aside.card{position:static;max-height:none}.results-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,.75fr);gap:.75rem}.chart-wrap{margin-top:0}}
    @media(max-width:720px){header{align-items:flex-start}.header-actions{flex-direction:column;align-items:stretch}.fields,.fields.three,.row-grid,.row-grid.three,.row-grid.four{grid-template-columns:1fr}.field-full{grid-column:auto}.results-shell{display:block}.chart-wrap{margin-top:.75rem}.run-rate,.wait-grid,.scenario-buttons,.scenario-transfer{grid-template-columns:1fr}.dynamic-row{padding:.58rem}.group{padding:.72rem}.row-head{align-items:flex-start}.decision-grid{grid-template-columns:1fr}}
    @media(max-width:460px){main{padding:.55rem}header{margin:-.55rem -.55rem .7rem;padding:.7rem .55rem}.card{padding:.55rem;border-radius:.72rem}.group{border-radius:.68rem}.chart-wrap{grid-template-columns:1fr;justify-items:center}.legend{width:100%}.money-input{grid-template-columns:minmax(0,1fr) 4.6rem}.mode-switch{grid-template-columns:1fr}.header-actions{gap:.35rem}.lang-switch{align-self:flex-end}}
    @media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}
    @media print{
      :root{color-scheme:light;--text:#111827;--muted:#4b5563;--line:#d1d5db;--panel:#fff;--card:#fff;--field:#fff}
      body{color:#111827;background:#fff;background-image:none;font-family:Arial,sans-serif}
      main{width:100%;max-width:none;padding:0}
      header{position:static;margin:0 0 12px;padding:0 0 10px;border-bottom:2px solid #111827;background:#fff;box-shadow:none}
      .header-actions,.toolbar,.scenario-box,.actions,.remove-btn,.hint,.validation,.lang-switch,.mode-switch{display:none!important}
      .layout{display:grid;grid-template-columns:1.15fr .85fr;gap:12px}
      .card{padding:0;border:0;background:#fff;box-shadow:none;overflow:visible}
      aside.card{position:static;max-height:none;overflow:visible}
      .group{break-inside:avoid;margin-bottom:8px;padding:8px;border:1px solid #cbd5e1;background:#fff}
      .group h2,.aside-title{color:#111827}
      input,select,textarea{min-height:auto;padding:3px 4px;color:#111827;border:0;border-bottom:1px solid #cbd5e1;background:#fff}
      .dynamic-row{break-inside:avoid;border:1px solid #d1d5db;background:#fff}
      .formula,.note,.computed,.row-cost{color:#374151;border:1px solid #d1d5db;background:#f8fafc}
      .total{color:#fff;background:#111827!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
      .result span,.result strong{color:#111827}
      .chart-wrap{display:block;border:1px solid #d1d5db;background:#fff}
      .donut{display:none}
      .legend{gap:6px}
      .legend-item{grid-template-columns:110px minmax(0,1fr) auto;font-size:10px}
      .dot{width:auto;height:8px;border-radius:4px}
      .legend-item span:nth-child(2){color:#111827;white-space:normal}
      .decision{color:#111827;border:1px solid #9ca3af;background:#f8fafc}
      .decision h3,.decision-item span,.decision-item b{color:#111827}
      .decision-item{background:#fff;border:1px solid #d1d5db}
      .quality{color:#111827;background:#fff}
      .print-formulas{display:block!important;margin-top:12px;padding:10px;border:1px solid #d1d5db;font-size:10px;line-height:1.45}
      @page{size:A4;margin:12mm}
    }

/* VacancyCrowd site integration. */
.site-back-link {
  min-height: 2.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .48rem .72rem;
  border: 1px solid var(--line2);
  border-radius: .58rem;
  color: var(--text);
  background: rgba(255,255,255,.045);
  text-decoration: none;
  font-size: .7rem;
  font-weight: 700;
  line-height: 1.25;
  white-space: nowrap;
}
.site-back-link:hover { background: rgba(255,255,255,.09); }
.site-back-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.site-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  margin-top: 1rem;
  padding: 1rem .75rem .25rem;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: .68rem;
  line-height: 1.45;
  text-align: center;
}
.site-footer a { color: var(--accent2); text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
@media(max-width:720px){
  .site-back-link { width: 100%; white-space: normal; }
}
@media print {
  .site-footer, .site-back-link { display: none !important; }
}

/* Responsive hardening for narrow windows and long translated labels. */
button {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
  line-height: 1.3;
}

.result strong,
.total-row strong,
.legend-item b,
.decision-item b,
.rate b,
.wait-card strong {
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}

@media (max-width: 420px) {
  .header-actions,
  .lang-switch,
  #clearBtn {
    width: 100%;
  }

  .result {
    grid-template-columns: minmax(0, 1fr);
  }

  .result strong,
  .total-row strong {
    text-align: left;
  }

  .total-row {
    flex-direction: column;
  }
}

/* =========================================================
   Layout repair: prevent field overlap and viewport overflow
   ========================================================= */
html,
body {
  width: 100%;
  max-width: 100%;
}

main,
header,
.layout,
.card,
.form,
.group,
.fields,
.row-grid,
.results-shell,
.header-actions,
.scenario-grid,
.scenario-buttons,
.scenario-transfer,
.chart-wrap,
.decision-grid,
.run-rate,
.wait-grid {
  min-width: 0;
}

main {
  width: 100%;
  max-width: 82rem;
}

header {
  flex-wrap: wrap;
}

header > div:first-child {
  flex: 1 1 30rem;
  max-width: 100%;
}

.header-actions {
  min-width: 0;
  max-width: 100%;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.site-back-link,
button,
input,
select,
textarea {
  min-width: 0;
  max-width: 100%;
}

.site-back-link {
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

label,
.hint,
.formula,
.note,
.computed,
.row-cost,
.result,
.total,
.rate,
.wait-card,
.decision-item,
.legend-item {
  overflow-wrap: anywhere;
}

select {
  text-overflow: ellipsis;
}

@media (max-width: 1120px) {
  header {
    flex-direction: column;
    align-items: stretch;
  }

  header > div:first-child {
    flex-basis: auto;
    width: 100%;
  }

  .header-actions {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: stretch;
    justify-content: stretch;
  }

  .layout {
    grid-template-columns: minmax(0, 1fr);
  }

  aside.card {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .results-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(16rem, .72fr);
    gap: .75rem;
  }

  .fields.three,
  .row-grid.three,
  .row-grid.four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .results-shell {
    display: block;
  }

  .chart-wrap {
    margin-top: .75rem;
  }

  .fields,
  .fields.three,
  .row-grid,
  .row-grid.three,
  .row-grid.four {
    grid-template-columns: minmax(0, 1fr);
  }

  .field-full {
    grid-column: auto;
  }

  .run-rate,
  .wait-grid,
  .scenario-buttons,
  .scenario-transfer,
  .decision-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 560px) {
  .header-actions {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .site-back-link {
    grid-column: 1 / -1;
    width: 100%;
  }

  .lang-switch,
  #clearBtn {
    width: 100%;
  }

  .scenario-grid,
  .money-input,
  .mode-switch {
    grid-template-columns: minmax(0, 1fr);
  }

  .total-row {
    flex-direction: column;
  }

  .total-row strong,
  .result strong {
    width: 100%;
    text-align: left;
  }

  .chart-wrap {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
  }

  .legend {
    width: 100%;
  }
}
