/* Calculator pages only. "The calculator did not load": hidden while the bundle loads;
   shown if the widget never mounts (the bundle failed to load) or it threw (.now).
   Without JS, noscript.css hides it (the <noscript> copy shows instead). */
.calc-load-failed {
  visibility: hidden;
  animation: calc-load-failed 0s 8s forwards;
}

.calc-load-failed.now {
  visibility: visible;
  animation: none;
}

@keyframes calc-load-failed {
  to {
    visibility: visible;
  }
}

/* Mounted: the fallback is gone, and the line never shows (even if the delay ends after mount). */
.calc-ready .calc-load-failed {
  display: none;
}

/* Room for the mounted calculator, so the sections below don't jump when it replaces the
   short fallback (CLS). Each value is the smallest mounted height across its width band
   (measured 2026-10-31 after the redesign, Chrome on macOS, by resizing one mounted page
   from 320 to 1600px: a band starts at every width where the empty form's height changes,
   and the value is that height rounded down); a taller form (more shifts, a result) just
   grows past it. Re-measure when a form's layout changes: a value above the mounted
   height leaves a gap. Only until mount (a mounted form that shrinks must not leave a gap),
   and released with the "didn't load" line's 8s delay when the bundle never mounts. */
[data-calc]:not(.calc-ready) {
  min-height: var(--calc-h, 0);
  animation: calc-unreserve 0s 8s forwards;
}

@keyframes calc-unreserve {
  to {
    min-height: 0;
  }
}

[data-calc]:has(.calc-load-failed.now) {
  min-height: 0;
}

[data-page='home'] { --calc-h: 1249px; }
[data-page='overtime'] { --calc-h: 996px; }
[data-page='rest'], [data-page='night'] { --calc-h: 932px; }
[data-page='net'] { --calc-h: 1115px; }
[data-page='minwage'] { --calc-h: 505px; }

@media (min-width: 342px) {
  [data-page='home'] { --calc-h: 1228px; }
}

@media (min-width: 352px) {
  [data-page='net'] { --calc-h: 1094px; }
}

@media (min-width: 360px) {
  [data-page='home'] { --calc-h: 1161px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 865px; }
}

@media (min-width: 365px) {
  [data-page='minwage'] { --calc-h: 455px; }
}

@media (min-width: 382px) {
  [data-page='net'] { --calc-h: 1076px; }
}

@media (min-width: 402px) {
  [data-page='net'] { --calc-h: 1054px; }
}

@media (min-width: 416px) {
  [data-page='home'] { --calc-h: 1111px; }
  [data-page='overtime'] { --calc-h: 946px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 815px; }
}

@media (min-width: 422px) {
  [data-page='overtime'] { --calc-h: 857px; }
}

@media (min-width: 490px) {
  [data-page='home'] { --calc-h: 1089px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 793px; }
}

@media (min-width: 512px) {
  [data-page='home'] { --calc-h: 1022px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 726px; }
}

@media (min-width: 577px) {
  [data-page='net'] { --calc-h: 1036px; }
}

@media (min-width: 596px) {
  [data-page='minwage'] { --calc-h: 405px; }
}

@media (min-width: 640px) {
  [data-page='home'] { --calc-h: 1041px; }
  [data-page='overtime'] { --calc-h: 871px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 740px; }
  [data-page='net'] { --calc-h: 1048px; }
  [data-page='minwage'] { --calc-h: 417px; }
}

@media (min-width: 750px) {
  [data-page='home'] { --calc-h: 1019px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 718px; }
}

@media (min-width: 766px) {
  [data-page='net'] { --calc-h: 1025px; }
}

@media (min-width: 1100px) {
  [data-page='home'] { --calc-h: 861px; }
  [data-page='overtime'] { --calc-h: 664px; }
  [data-page='rest'], [data-page='night'] { --calc-h: 578px; }
  [data-page='net'] { --calc-h: 667px; }
  [data-page='minwage'] { --calc-h: 339px; }
}

@media (min-width: 1125px) {
  [data-page='minwage'] { --calc-h: 291px; }
}
