.numeric-date-input { display: grid !important; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr) minmax(0, 1fr); gap: 10px; width: 100%; min-width: 0; margin: 0; }
.numeric-date-cell { display: flex; align-items: center; min-width: 0; gap: 4px; }
.numeric-date-input input.numeric-date-part { width: 100%; min-width: 0; padding-inline: 4px; font-size: 16px; font-variant-numeric: tabular-nums; }
.numeric-date-unit { flex: 0 0 auto; font-size: 12px; opacity: .65; }
.numeric-date-input:has(input:disabled) { opacity: .65; }
.numeric-time-input { display: grid; grid-template-columns: minmax(108px, 1.6fr) repeat(2, minmax(60px, 1fr)); align-items: center; gap: 12px; width: 100%; max-width: 340px; margin: 4px 0; color: inherit; }
.numeric-time-input .numeric-time-periods { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line, #cabcaa); border-radius: 6px; padding: 3px; gap: 2px; }
.numeric-time-input .numeric-time-period { position: relative; display: block; margin: 0; cursor: pointer; }
.numeric-time-input .numeric-time-period input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; opacity: 0; clip-path: inset(50%); }
.numeric-time-input .numeric-time-period span { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 6px; font: 15px/1.5 SUIT, system-ui, sans-serif; border-radius: 3px; }
.numeric-time-input .numeric-time-period input:checked + span { background: var(--ink, #4c4037); color: var(--paper, #faf6ec); }
.numeric-time-input .numeric-time-period input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 2px; }
.numeric-time-input .numeric-time-cell { display: flex; align-items: center; gap: 5px; min-width: 0; border-bottom: 1px solid var(--line, #cabcaa); }
.numeric-time-input input.numeric-time-part { display: block; width: 100%; min-width: 0; height: 52px; min-height: 52px; border: 0; border-radius: 0; background: transparent; padding: 8px 2px; margin: 0; text-align: center; color: inherit; font: 20px/1.5 SUIT, system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.numeric-time-input input.numeric-time-part::placeholder { color: inherit; font-size: 20px; opacity: .35; }
.numeric-time-input .numeric-time-unit { font: 14px/1.5 SUIT, system-ui, sans-serif; opacity: .7; padding-right: 4px; }
.numeric-time-input:has(input:disabled) { opacity: .5; }
.numeric-time-error { display: block; max-width: 340px; margin-top: 6px; color: inherit; font-size: 12px; line-height: 1.7; }
.numeric-time-error[hidden], input[data-numeric-time][type=hidden] { display: none !important; }
@media(max-width: 600px) {
  .field-row:has(.numeric-date-input), .pair-fields:has(.numeric-date-input), .member-fieldset:has(.numeric-date-input) { grid-template-columns: minmax(0, 1fr); }
}