@media screen and (min-width: 1024px) {
  #ytlink {
    grid-column: 1 / span 2;
  }
}

@media screen and (max-width: 1023px) {
  #ytlink-wrap {
    grid-template-columns: 1fr;
  }
}

input[type=time]::-webkit-datetime-edit-ampm-field {
  display: none;
}

fieldset:has(:where(input,select,textarea,fieldset,.grid)[aria-invalid=true])+small {
  color: var(--pico-del-color);
}

fieldset:has(:where(input,select,textarea,fieldset,.grid)[aria-invalid=false])+small {
  color: var(--pico-ins-color);
}

:where(input,select,textarea,fieldset,.grid)+small {
  margin-bottom: 0;
}

.nowrap {
  white-space: nowrap;
}

.soft {
  opacity: 0.65;
}

.card {
  border: 2px solid var(--pico-muted-border-color);
}

.flex-left-right {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--pico-spacing);
}

.flex-left-right > .right-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--pico-spacing);
}

.katex-display {
  overflow: auto hidden;
}

.credit {
  padding: 0;
}

.credit li {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  display: inline;
}

.credit li:not(:last-child)::after {
  content: "·";
  margin: calc(var(--pico-form-element-spacing-horizontal) / 4);
}

#ytlink > fieldset:nth-child(1) > input:nth-child(2) {
  padding: var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-vertical);
}

#timeline > thead > tr > th:nth-child(1) {
  min-width: 10rem;
  width: 10rem;
}

#timeline > thead > tr > th:nth-child(2) {
  min-width: 11rem;
}

#timeline > tbody > tr > td > input {
  margin-bottom: 0;
}

#timeline-add {
  --pico-border-color: var(--pico-color-green-500);
}

#timeline-add:not(.outline) {
  --pico-background-color: var(--pico-color-green-500);
}

#timeline-add.outline {
  color: var(--pico-color-green-500);
}

#timeline-add:focus {
  --pico-box-shadow: var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) rgba(57, 135, 18, 0.375);
}

#timeline-del {
  --pico-border-color: var(--pico-color-red-500);
}

#timeline-del:not(.outline) {
  --pico-background-color: var(--pico-color-red-500);
}

#timeline-del.outline {
  color: var(--pico-color-red-500);
}

#timeline-del:focus {
  --pico-box-shadow: var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) rgba(217, 53, 38, 0.375);
}

#timeline-copy {
  --pico-border-color: var(--pico-color-indigo-600);
}

#timeline-copy:not(.outline) {
  --pico-background-color: var(--pico-color-indigo-600);
}

#timeline-copy.outline {
  color: var(--pico-color-indigo-600);
}

#timeline-copy.success.outline {
  color: var(--pico-color-green-500);
  --pico-border-color: var(--pico-color-green-500);
}

#timeline-copy.failed.outline {
  color: var(--pico-color-red-500);
  --pico-border-color: var(--pico-color-red-500);
}

#timeline-copy:focus {
  --pico-box-shadow: var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) rgba(82, 78, 210, 0.375);
}