.wany-page-shell {
  width: min(100%, 1400px) !important;
  max-width: 1400px !important;
}

.wany-page-header,
.wany-page-content {
  width: 100% !important;
  max-width: 1400px !important;
}

.wany-page-header > .wp-block-post-title {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

.wany-payroll-calculator {
  --wany-payroll-ink: #172033;
  --wany-payroll-muted: #5f6b7a;
  --wany-payroll-line: #dce2ea;
  --wany-payroll-soft: #f5f7fa;
  --wany-payroll-accent: #176b87;
  --wany-payroll-accent-dark: #0e4e66;
  --wany-payroll-warn: #fff8e6;
  --wany-payroll-danger: #9c2c2c;
  color: var(--wany-payroll-ink);
  font-size: 16px;
  line-height: 1.65;
  margin: 2rem auto;
  width: 100% !important;
  max-width: 1400px !important;
}

.wany-payroll-calculator *,
.wany-payroll-calculator *::before,
.wany-payroll-calculator *::after {
  box-sizing: border-box;
}

.wany-payroll-calculator h2,
.wany-payroll-calculator h3,
.wany-payroll-calculator h4,
.wany-payroll-calculator p {
  margin-top: 0;
}

.wany-payroll__hero {
  background: linear-gradient(135deg, #0e4e66, #176b87);
  border-radius: 20px;
  color: #fff;
  margin-bottom: 1rem;
  padding: clamp(1rem, 2.5vw, 1.65rem);
}

.wany-payroll__hero > p:not(.wany-payroll__eyebrow):not(.wany-payroll__privacy) {
  font-size: 1.05rem;
  max-width: 760px;
}

.wany-payroll__eyebrow {
  font-size: .8rem;
  font-weight: 800;
  letter-spacing: .08em;
  margin-bottom: .55rem;
  text-transform: uppercase;
}

.wany-payroll__privacy {
  background: rgb(255 255 255 / 12%);
  border: 1px solid rgb(255 255 255 / 30%);
  border-radius: 999px;
  display: inline-block;
  font-size: .86rem;
  margin: .3rem 0 0;
  padding: .38rem .8rem;
}

.wany-payroll__layout {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1.18fr) minmax(360px, .82fr);
}

.wany-payroll__panel {
  background: #fff;
  border: 1px solid var(--wany-payroll-line);
  border-radius: 16px;
  box-shadow: 0 8px 28px rgb(23 32 51 / 6%);
  padding: clamp(1rem, 3vw, 1.55rem);
}

.wany-payroll__section-heading {
  align-items: flex-start;
  display: flex;
  gap: .75rem;
  margin-bottom: 1.2rem;
}

.wany-payroll__section-heading > span {
  align-items: center;
  background: var(--wany-payroll-accent);
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  flex: 0 0 2rem;
  font-weight: 800;
  height: 2rem;
  justify-content: center;
}

.wany-payroll__section-heading h3 {
  color: var(--wany-payroll-ink);
  font-size: 1.18rem;
  line-height: 1.3;
  margin-bottom: .18rem;
}

.wany-payroll__section-heading p {
  color: var(--wany-payroll-muted);
  font-size: .86rem;
  margin-bottom: 0;
}

.wany-payroll__fields {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wany-payroll__field {
  display: flex;
  flex-direction: column;
  gap: .38rem;
  min-width: 0;
}

.wany-payroll__field > span:first-child {
  color: var(--wany-payroll-ink);
  font-size: .9rem;
  font-weight: 700;
}

.wany-payroll__field b {
  color: var(--wany-payroll-danger);
  font-size: .7rem;
  margin-left: .25rem;
}

.wany-payroll__field small,
.wany-payroll__check small {
  color: var(--wany-payroll-muted);
  display: block;
  font-size: .82rem;
  line-height: 1.5;
}

.wany-payroll__field-error {
  color: var(--wany-payroll-danger) !important;
  font-weight: 700;
}

.wany-payroll__field select[aria-invalid="true"],
.wany-payroll__field input[aria-invalid="true"] {
  border-color: var(--wany-payroll-danger);
  box-shadow: 0 0 0 2px rgb(180 35 24 / 10%);
}

.wany-payroll__field input,
.wany-payroll__field select {
  appearance: none;
  background: #fff;
  border: 1px solid #b9c3d0;
  border-radius: 9px;
  color: var(--wany-payroll-ink);
  font: inherit;
  height: 46px;
  max-width: 100%;
  padding: .62rem .72rem;
  width: 100%;
}

.wany-payroll__field select {
  background-image: linear-gradient(45deg, transparent 50%, #586578 50%), linear-gradient(135deg, #586578 50%, transparent 50%);
  background-position: calc(100% - 16px) 19px, calc(100% - 11px) 19px;
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px;
  padding-right: 2.2rem;
}

.wany-payroll__field input:focus,
.wany-payroll__field select:focus,
.wany-payroll__check input:focus-visible,
.wany-payroll__reset:focus-visible {
  outline: 3px solid rgb(23 107 135 / 22%);
  outline-offset: 2px;
}

.wany-payroll__money-input,
.wany-payroll__suffix-input {
  position: relative;
}

.wany-payroll__money-input input,
.wany-payroll__suffix-input input {
  padding-right: 2.7rem;
}

.wany-payroll__money-input em,
.wany-payroll__suffix-input em {
  color: var(--wany-payroll-muted);
  font-style: normal;
  position: absolute;
  right: .78rem;
  top: 50%;
  transform: translateY(-50%);
}

.wany-payroll__field--wide {
  grid-column: 1 / -1;
}

.wany-payroll__check {
  align-items: flex-start;
  background: var(--wany-payroll-soft);
  border: 1px solid var(--wany-payroll-line);
  border-radius: 10px;
  cursor: pointer;
  display: flex;
  gap: .7rem;
  padding: .8rem;
}

.wany-payroll__check input {
  accent-color: var(--wany-payroll-accent);
  flex: 0 0 auto;
  height: 1.15rem;
  margin: .22rem 0 0;
  width: 1.15rem;
}

.wany-payroll__check strong {
  display: block;
  font-size: .92rem;
}

.wany-payroll__advanced,
.wany-payroll__employer-settings {
  border: 1px solid var(--wany-payroll-line);
  border-radius: 10px;
  margin-top: 1rem;
}

.wany-payroll__advanced > summary,
.wany-payroll__employer-settings > summary,
.wany-payroll__employer > summary,
.wany-payroll__basis > summary {
  color: var(--wany-payroll-accent-dark);
  cursor: pointer;
  font-weight: 800;
  list-style-position: outside;
}

.wany-payroll__advanced > summary {
  padding: .8rem .9rem;
}

.wany-payroll-calculator summary:focus-visible {
  outline: 3px solid rgb(23 107 135 / 22%);
  outline-offset: 2px;
  border-radius: 6px;
}

.wany-payroll__advanced-fields {
  border-top: 1px solid var(--wany-payroll-line);
  padding: .9rem;
}

.wany-payroll__reset {
  background: transparent;
  border: 0;
  color: var(--wany-payroll-accent-dark);
  cursor: pointer;
  font: inherit;
  font-size: .84rem;
  font-weight: 700;
  margin-top: 1rem;
  padding: .35rem 0;
  text-decoration: underline;
  text-underline-offset: .2em;
}

.wany-payroll__results {
  align-self: start;
  position: sticky;
  top: 1rem;
}

.wany-payroll__empty {
  background: var(--wany-payroll-soft);
  border-radius: 10px;
  color: var(--wany-payroll-muted);
  margin: 0;
  padding: 1rem;
}

.wany-payroll__errors {
  background: #fff0f0;
  border-left: 4px solid var(--wany-payroll-danger);
  color: #702020;
  margin-bottom: 1rem;
  padding: .8rem 1rem;
}

.wany-payroll__errors ul {
  margin: .4rem 0 0;
  padding-left: 1.25rem;
}

.wany-payroll__net {
  background: var(--wany-payroll-accent-dark);
  border-radius: 13px;
  color: #fff;
  margin-bottom: 1rem;
  padding: 1.15rem;
}

.wany-payroll__net > span,
.wany-payroll__net small {
  display: block;
}

.wany-payroll__net strong {
  display: block;
  font-size: clamp(1.7rem, 5vw, 2.25rem);
  line-height: 1.25;
  margin: .15rem 0 .35rem;
  overflow-wrap: anywhere;
}

.wany-payroll__net small {
  color: rgb(255 255 255 / 78%);
  font-size: .75rem;
}

.wany-payroll__result-status {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: .75rem;
}

.wany-payroll__result-status span {
  border: 1px solid rgb(255 255 255 / 28%);
  border-radius: 999px;
  background: rgb(255 255 255 / 10%);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  line-height: 1.35;
  padding: .28rem .55rem;
}

.wany-payroll__result-status span[data-state="warning"] {
  background: rgb(255 248 230 / 18%);
  border-color: rgb(255 248 230 / 48%);
}

.wany-payroll__field small a {
  color: var(--wany-payroll-accent-dark);
  font-weight: 700;
  text-underline-offset: .16em;
}

.wany-payroll__breakdown,
.wany-payroll__basis dl {
  margin: 0;
}

.wany-payroll__breakdown > div,
.wany-payroll__basis dl > div {
  align-items: baseline;
  border-bottom: 1px solid var(--wany-payroll-line);
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: .55rem 0;
}

.wany-payroll__breakdown dt,
.wany-payroll__basis dt {
  color: var(--wany-payroll-muted);
  font-size: .86rem;
}

.wany-payroll__breakdown dd,
.wany-payroll__basis dd {
  font-size: .9rem;
  font-weight: 700;
  margin: 0;
  text-align: right;
}

.wany-payroll__breakdown-total dt,
.wany-payroll__breakdown-total dd {
  color: var(--wany-payroll-ink);
  font-weight: 800;
}

.wany-payroll-calculator [hidden] {
  display: none !important;
}

.wany-payroll__employer {
  border-top: 1px solid var(--wany-payroll-line);
  margin-top: 1.1rem;
  padding-top: 1.1rem;
}

.wany-payroll__employer > summary {
  font-size: 1.05rem;
}

.wany-payroll__employer-body {
  padding-top: .65rem;
}

.wany-payroll__employer-body > p {
  color: var(--wany-payroll-muted);
  font-size: .82rem;
  margin: 0 0 .65rem;
}

.wany-payroll__employer .wany-payroll__breakdown {
  margin-bottom: .5rem;
}

.wany-payroll__employer-settings {
  background: var(--wany-payroll-soft);
  margin: 0 0 .8rem;
}

.wany-payroll__employer-settings > summary {
  font-size: .86rem;
  padding: .65rem .75rem;
}

.wany-payroll__employer-settings-fields {
  border-top: 1px solid var(--wany-payroll-line);
  display: grid;
  gap: .7rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: .75rem;
}

.wany-payroll__employer .wany-payroll__employer-note {
  background: var(--wany-payroll-soft);
  border-radius: 8px;
  line-height: 1.5;
  padding: .6rem .7rem;
}

.wany-payroll__basis {
  background: var(--wany-payroll-soft);
  border-radius: 10px;
  margin-top: 1rem;
  padding: .9rem;
}

.wany-payroll__basis > summary {
  font-size: .95rem;
}

.wany-payroll__basis[open] > summary {
  margin-bottom: .4rem;
}

.wany-payroll__basis dl > div {
  align-items: flex-start;
}

.wany-payroll__basis dd {
  max-width: 66%;
  overflow-wrap: anywhere;
}

.wany-payroll__warnings p {
  background: var(--wany-payroll-warn);
  border-left: 3px solid #d29b23;
  font-size: .78rem;
  margin: .7rem 0 0;
  padding: .55rem .65rem;
}

.wany-payroll__notes {
  width: 100%;
  max-width: none;
  margin: 1.25rem 0 0;
}

.wany-payroll__notes > * {
  width: min(100%, 1100px);
  margin-left: auto !important;
  margin-right: auto !important;
}

.wany-payroll__notes > ul,
.wany-payroll__sources {
  margin-bottom: 1rem;
  padding-left: 1.25rem;
}

.wany-payroll__notes li {
  margin-bottom: .45rem;
}

.wany-payroll__disclaimer {
  background: var(--wany-payroll-soft);
  border-left: 4px solid #8190a2;
  font-size: .86rem;
  padding: .8rem 1rem;
}

.wany-payroll__notes summary {
  color: var(--wany-payroll-accent-dark);
  cursor: pointer;
  font-weight: 800;
}

.wany-payroll__sources {
  font-size: .86rem;
  margin-top: .7rem;
}

.wany-payroll__sources a {
  overflow-wrap: anywhere;
}

@media (max-width: 820px) {
  .wany-payroll__layout {
    grid-template-columns: minmax(0, 1fr);
  }

  .wany-payroll__results {
    position: static;
  }
}

@media (max-width: 560px) {
  .wany-payroll-calculator {
    font-size: 15px;
    margin-block: 1rem;
  }

  .wany-payroll__hero,
  .wany-payroll__panel {
    border-radius: 12px;
  }

  .wany-payroll__hero {
    padding: 1rem;
  }

  .wany-payroll__field small,
  .wany-payroll__check small {
    font-size: .84rem;
  }

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

  .wany-payroll__field--wide {
    grid-column: auto;
  }

  .wany-payroll__employer-settings-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  .wany-payroll__breakdown > div,
  .wany-payroll__basis dl > div {
    gap: .6rem;
  }

  .wany-payroll__basis dd {
    max-width: 60%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .wany-payroll-calculator * {
    scroll-behavior: auto !important;
  }
}


/* Payslip Excel export: optional information stays separate from salary calculation. */
.wany-payroll__slip-action {
  border: 1px solid #c7dce5;
  border-radius: 12px;
  background: #f1f8fb;
  margin: 1.1rem 0;
  padding: .95rem;
}
.wany-payroll__slip-action p {
  color: var(--wany-payroll-muted);
  font-size: .8rem;
  margin: .55rem 0 0;
}
.wany-payroll__slip-open,
.wany-payroll__slip-footer [data-slip-download] {
  border: 0;
  border-radius: 9px;
  background: #146b54;
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-weight: 750;
  min-height: 46px;
  padding: .6rem 1rem;
}
.wany-payroll__slip-open {
  width: 100%;
}
.wany-payroll__slip-open:hover,
.wany-payroll__slip-footer [data-slip-download]:hover {
  background: #07533f;
}
.wany-payroll__slip-dialog {
  border: 1px solid var(--wany-payroll-line);
  border-radius: 15px;
  box-shadow: 0 20px 65px rgb(0 0 0 / 25%);
  color: var(--wany-payroll-ink);
  font: inherit;
  line-height: 1.6;
  margin: auto;
  max-height: min(90dvh, 1000px);
  max-width: min(94vw, 780px);
  overflow: auto;
  padding: 0;
  width: 100%;
}
.wany-payroll__slip-dialog::backdrop {
  background: rgb(10 25 35 / 70%);
}
.wany-payroll__slip-form {
  margin: 0;
}
.wany-payroll__slip-header {
  align-items: start;
  background: #f3f7fa;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: 1rem 1.2rem;
}
.wany-payroll__slip-header h3 {
  font-size: 1.25rem;
  margin: 0 0 .2rem;
}
.wany-payroll__slip-header p,
.wany-payroll__slip-body fieldset > p {
  color: var(--wany-payroll-muted);
  font-size: .8rem;
  margin: 0;
}
.wany-payroll__slip-close,
.wany-payroll__slip-remove {
  align-items: center;
  background: #fff;
  border: 1px solid var(--wany-payroll-line);
  border-radius: 7px;
  color: var(--wany-payroll-ink);
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 40px;
  font: inherit;
  font-size: 1.4rem;
  height: 40px;
  justify-content: center;
  padding: 0;
}
.wany-payroll__slip-body {
  display: grid;
  gap: 1rem;
  padding: 1rem 1.2rem;
}
.wany-payroll__slip-body fieldset {
  border: 1px solid var(--wany-payroll-line);
  border-radius: 10px;
  margin: 0;
  min-width: 0;
  padding: .75rem;
}
.wany-payroll__slip-body legend {
  color: var(--wany-payroll-ink);
  font-size: 1rem;
  font-weight: 800;
  padding: 0 .3rem;
}
.wany-payroll__slip-fields {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: .5rem;
}
.wany-payroll__slip-fields label {
  color: var(--wany-payroll-ink);
  display: grid;
  font-size: .82rem;
  font-weight: 700;
  gap: .25rem;
  min-width: 0;
}
.wany-payroll__slip-fields input,
.wany-payroll__slip-row input {
  appearance: none;
  background: #fff;
  border: 1px solid #b9c3d0;
  border-radius: 8px;
  color: var(--wany-payroll-ink);
  font: inherit;
  font-size: 16px;
  height: 43px;
  min-width: 0;
  padding: .4rem .55rem;
  width: 100%;
}
.wany-payroll__slip-rows {
  display: grid;
  gap: .55rem;
  margin: .6rem 0;
}
.wany-payroll__slip-row {
  align-items: center;
  display: grid;
  gap: .4rem;
  grid-template-columns: minmax(0, 1fr) minmax(100px, .65fr) 40px;
}
.wany-payroll__slip-add {
  background: #fff;
  border: 1px solid var(--wany-payroll-accent);
  border-radius: 8px;
  color: var(--wany-payroll-accent-dark);
  cursor: pointer;
  font: inherit;
  font-size: .83rem;
  font-weight: 700;
  min-height: 40px;
  padding: .45rem .7rem;
}
.wany-payroll__slip-add:disabled {
  cursor: not-allowed;
  opacity: .45;
}
.wany-payroll__slip-subtotal {
  color: #146b54;
  font-size: .84rem;
  font-weight: 700;
  margin: .55rem 0 0;
}
.wany-payroll__slip-mismatch {
  color: var(--wany-payroll-danger);
}
.wany-payroll__slip-preview {
  background: #f1f8fb;
  border-radius: 9px;
  padding: .8rem;
}
.wany-payroll__slip-preview > div {
  align-items: baseline;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  padding: .2rem 0;
}
.wany-payroll__slip-preview > div:last-child {
  border-top: 1px solid #b9c3d0;
  font-weight: 800;
  margin-top: .4rem;
  padding-top: .5rem;
}
.wany-payroll__slip-errors {
  background: #fff0f0;
  border-left: 4px solid var(--wany-payroll-danger);
  color: #702020;
  font-size: .82rem;
  padding: .6rem .8rem;
  white-space: pre-line;
}
.wany-payroll__slip-privacy {
  color: var(--wany-payroll-muted);
  font-size: .79rem;
  margin: 0;
}
.wany-payroll__slip-footer {
  background: #f3f7fa;
  display: flex;
  gap: .65rem;
  justify-content: flex-end;
  padding: .9rem 1.2rem;
  position: sticky;
  bottom: 0;
}
.wany-payroll__slip-footer button {
  min-height: 44px;
}
.wany-payroll__slip-footer [data-slip-close] {
  background: #fff;
  border: 1px solid #b9c3d0;
  border-radius: 9px;
  color: var(--wany-payroll-ink);
  cursor: pointer;
  font: inherit;
  padding: .5rem 1rem;
}
.wany-payroll__slip-dialog :is(button, input):focus-visible {
  outline: 3px solid rgb(23 107 135 / 25%);
  outline-offset: 2px;
}
@media (max-width: 560px) {
  .wany-payroll__slip-dialog {
    max-height: 95dvh;
    max-width: 98vw;
  }
  .wany-payroll__slip-header,
  .wany-payroll__slip-body,
  .wany-payroll__slip-footer {
    padding-inline: .75rem;
  }
  .wany-payroll__slip-fields {
    grid-template-columns: minmax(0, 1fr);
  }
  .wany-payroll__slip-row {
    grid-template-columns: minmax(0, 1fr) minmax(75px, .6fr) 36px;
  }
  .wany-payroll__slip-remove {
    flex-basis: 36px;
    height: 36px;
  }
  .wany-payroll__slip-footer {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
  }
  .wany-payroll__slip-footer button {
    padding-inline: .25rem !important;
  }
  .wany-payroll__slip-preview > div {
    font-size: .85rem;
  }
}

/* Server-rendered, indexable user guide for the existing Japan payroll tool. */
.wany-payroll__guide {
  width: 100%;
  max-width: none;
  margin: 1.25rem 0 0;
}

.wany-payroll__guide > * {
  width: min(100%, 1100px);
  margin-left: auto !important;
  margin-right: auto !important;
}
.wany-payroll__guide h3 {
  color: var(--wany-payroll-ink);
  font-size: clamp(1.2rem, 2.5vw, 1.5rem);
  line-height: 1.45;
  margin: 0 0 .85rem;
}
.wany-payroll__guide h4 {
  color: var(--wany-payroll-ink);
  font-size: 1.03rem;
  margin: 1.3rem 0 .45rem;
}
.wany-payroll__guide p {
  color: var(--wany-payroll-ink);
  font-size: .94rem;
  line-height: 1.8;
  margin: 0 0 .85rem;
}
.wany-payroll__guide-faq {
  border-top: 1px solid var(--wany-payroll-line);
  margin: .7rem 0 0;
}
.wany-payroll__guide-faq > div {
  border-bottom: 1px solid var(--wany-payroll-line);
  padding: .9rem 0;
}
.wany-payroll__guide-faq dt {
  color: var(--wany-payroll-ink);
  font-weight: 800;
  line-height: 1.6;
  margin-bottom: .3rem;
}
.wany-payroll__guide-faq dd {
  color: var(--wany-payroll-muted);
  font-size: .88rem;
  line-height: 1.75;
  margin: 0;
}


.wany-payroll__year-notice,
.wany-payroll__care-guidance {
  display: block;
  margin-top: 0.45rem;
  padding: 0.55rem 0.65rem;
  border-left: 3px solid currentColor;
  line-height: 1.55;
}

.wany-payroll__care-guidance {
  font-weight: 650;
}
