.cc-milestone-tracker .cc-milestones-band {
  background: #0a3a6a;
  color: #fff;
  border-radius: 10px 10px 0 0;
  padding: 12px 16px;
}
.cc-milestone-tracker .cc-milestones-band .cc-milestones-title {
  margin: 0;
  font-size: 1rem;
}
.cc-milestone-tracker .cc-milestones-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid #e5e7eb;
  background: #fff;
  margin: 0 0 18px;
  border-radius: 0 0 10px 10px !important;
}
.cc-milestone-tracker .cc-milestones-table th {
  width: 33.3333333333% !important;
}
.cc-milestone-tracker .cc-milestones-table thead th {
  background: #f8fafc;
  padding: 12px 14px;
}
.cc-milestone-tracker .cc-milestones-table thead th .age {
  display: block;
  font-weight: 700;
}
.cc-milestone-tracker .cc-milestones-table thead th .age-short {
  display: block;
  opacity: 0.8;
  font-size: 0.875rem;
}
.cc-milestone-tracker .cc-milestones-table tbody td {
  padding: 12px 14px;
  min-height: 96px;
}
.cc-milestone-tracker .cc-milestones-table .cc-col {
  vertical-align: top;
  border-right: 1px solid #e5e7eb;
}
.cc-milestone-tracker .cc-milestones-table .cc-col:last-child {
  border-right: 0;
}
.cc-milestone-tracker .cc-milestones-table .cc-col.is-hidden {
  display: none;
}
@media screen and (max-width: 768px) {
  .cc-milestone-tracker .cc-milestones-table .cc-col > * {
    max-width: 85%;
  }
}
.cc-milestone-tracker .cc-milestones .cc-add-age {
  appearance: none;
  background: #fff;
  border: 1px dashed #94a3b8;
  border-radius: 8px;
  padding: 8px 10px;
  cursor: pointer;
}
@media (max-width: 800px) {
  .cc-milestone-tracker .cc-milestones-table thead {
    display: none;
  }
  .cc-milestone-tracker .cc-milestones-table, .cc-milestone-tracker .cc-milestones-table tbody, .cc-milestone-tracker .cc-milestones-table tr, .cc-milestone-tracker .cc-milestones-table td {
    display: block;
    width: 100%;
  }
  .cc-milestone-tracker .cc-milestones-table tbody td {
    border-top: 1px solid #e5e7eb;
  }
}
.cc-milestone-tracker td.cc-col.cc-col--placeholder {
  height: 96px;
}
.cc-milestone-tracker .age-pills {
  position: relative;
  padding-inline: 0.25rem;
}
@media screen and (max-width: 768px) {
  .cc-milestone-tracker .age-pills {
    padding-inline: 0.625rem;
  }
}
.cc-milestone-tracker .age-pills__rail {
  position: relative;
  --fade-w: 28px;
  mask-image: linear-gradient(to right, transparent 0, #000 var(--fade-w), #000 calc(100% - var(--fade-w)), transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 var(--fade-w), #000 calc(100% - var(--fade-w)), transparent 100%);
}
.cc-milestone-tracker .age-pills .cc-milestones-filter {
  list-style: none;
  margin: 0;
  padding: 0.5rem 0.25rem;
}
@media screen and (max-width: 768px) {
  .cc-milestone-tracker .age-pills .cc-milestones-filter {
    padding: 0.5rem 0.625rem;
  }
}
.cc-milestone-tracker .age-pills .cc-milestones-filter li {
  float: none;
  width: auto;
  display: inline-block !important;
  vertical-align: middle;
  margin: 0 0.5rem;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter .slick-list {
  margin: 0;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter .slick-track { /* leave as Slick sets it (display:block; width: px) */ }
.cc-milestone-tracker .age-pills .cc-milestones-filter .slick-slide {
  outline: none;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter input[type=checkbox] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 8.5rem;
  padding: 0.7rem 1.2rem;
  border: 2px solid #e6e7ea;
  border-radius: 9999px;
  background: #ffffff;
  color: #334155;
  font-weight: 600;
  line-height: 1;
  box-shadow: 0 1px 1px rgba(16, 24, 40, 0.06), 0 2px 10px rgba(16, 24, 40, 0.04);
  cursor: pointer;
  transition: border-color 0.18s ease, color 0.18s ease, background-color 0.18s ease, transform 0.02s ease;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter label:hover {
  border-color: #d0d2d6;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter label:active {
  transform: translateY(1px);
}
.cc-milestone-tracker .age-pills .cc-milestones-filter input[type=checkbox]:focus-visible + label {
  outline: 0;
  box-shadow: 0 0 0 3px rgba(17, 68, 136, 0.12), 0 1px 1px rgba(16, 24, 40, 0.06), 0 2px 10px rgba(16, 24, 40, 0.04);
}
.cc-milestone-tracker .age-pills .cc-milestones-filter input[type=checkbox]:checked + label {
  border-color: #114488;
  color: #114488;
  background: #eef4fb;
}
.cc-milestone-tracker .age-pills .cc-milestones-filter.is-max input[type=checkbox]:not(:checked) + label {
  color: #64748b;
  border-color: #e6e7ea;
  opacity: 0.7;
  cursor: not-allowed;
}
.cc-milestone-tracker .age-pills__pad {
  position: absolute;
  top: calc(50% - 10px);
  translate: 0 -50%;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #2f6fa1;
  color: #fff;
  border: 0;
  pointer-events: auto;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.15);
  opacity: 0.98;
  z-index: 2;
}
.cc-milestone-tracker .age-pills__pad--left {
  left: -56px;
}
@media screen and (max-width: 768px) {
  .cc-milestone-tracker .age-pills__pad--left {
    left: 0;
  }
}
.cc-milestone-tracker .age-pills__pad--right {
  right: -56px;
}
@media screen and (max-width: 768px) {
  .cc-milestone-tracker .age-pills__pad--right {
    right: 0;
  }
}
.cc-milestone-tracker .age-pills__pad:hover {
  background: #2a6390;
}
.cc-milestone-tracker .age-pills__pad:disabled, .cc-milestone-tracker .age-pills__pad.slick-disabled {
  opacity: 0.4;
  cursor: default;
}
@media (max-width: 640px) {
  .cc-milestone-tracker .age-pills .cc-milestones-filter label {
    min-width: 7.2rem;
    padding: 0.6rem 1rem;
  }
  .cc-milestone-tracker .age-pills__pad {
    width: 34px;
    height: 34px;
  }
}
.cc-milestone-tracker .cc-milestones-filter__hint {
  margin: 0.25rem 0 1rem;
  color: #64748b;
  font-size: 0.9rem;
}

.cc-milestones__file {
  display: flex;
  gap: 0.5rem;
}