.issue-time-arrangements { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.date-range-field { min-width: 0; margin: 0; }
.issue-time-arrangements > .date-range-field { margin:0; }
.date-range-button { display: flex; gap: 10px; align-items: center; min-width: 0; width: 100%; min-height: 100px; padding: 14px 12px; border: 1px solid rgba(117, 173, 187, .24); border-radius: 10px; background: linear-gradient(140deg, rgba(38, 65, 73, .64), rgba(9, 22, 29, .85)); color: #dcecf0; text-align: left; cursor: pointer; transition: border-color .18s, box-shadow .18s; }
.date-range-button:hover, .date-range-button:focus-visible { border-color: #31ccdc; box-shadow: 0 0 0 2px rgba(49, 204, 220, .12); outline: none; }
.date-range-button[aria-invalid="true"] { border-color: #ff8989; }
.date-range-icon { flex: none; color: #3ed7df; }
.date-range-copy { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 4px; font-size: 11px; line-height: 1.45; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.date-range-divider { font-size: 9px; color: #91a8af; }
.date-range-placeholder { color: #a9bec4; font-size: 11px; }
.date-range-edit { flex: none; color: #5adfe5; font-size: 10px; }
.date-range-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 5px; margin-bottom: 20px; border-radius: 10px; background: #09161d; }
.date-range-tabs button { min-width: 0; min-height: 68px; padding: 10px 8px; border: 1px solid transparent; border-radius: 7px; color: #a0b4bc; background: transparent; font-size: 12px; cursor: pointer; }
.date-range-tabs button[aria-selected="true"] { border-color: rgba(56, 207, 218, .35); color: #dbfcff; background: rgba(46, 121, 137, .22); }
.date-range-tabs button small { display: block; margin-top: 6px; font-size: 10px; color: inherit; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.date-range-picker, .date-range-picker .field { min-width: 0; }
.date-range-picker input[type="datetime-local"] { display: block; width: 100%; min-width: 0; max-width: 100%; min-height: 48px; box-sizing: border-box; font-size: 13px; }
.time-field-error, .field .time-field-error { display: block; margin-top: 7px; color: #ff9191; font-size: 11px; line-height: 1.6; }
.time-field-error[hidden] { display: none; }
.date-range-picker .modal-actions { gap: 8px; flex-wrap: wrap; }
.date-range-picker .clear-range { margin-right: auto; }
.rank-range-field, .rank-range-picker { min-width: 0; }
.rank-range-button { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; min-height: 49px; padding: 12px; border: 1px solid rgba(117, 173, 187, .24); border-radius: 10px; background: linear-gradient(140deg, rgba(38, 65, 73, .64), rgba(9, 22, 29, .85)); color: #dcecf0; text-align: left; cursor: pointer; }
.rank-range-button:hover, .rank-range-button:focus-visible { border-color: #31ccdc; box-shadow: 0 0 0 2px rgba(49, 204, 220, .12); outline: none; }
.rank-range-button[aria-invalid="true"] { border-color: #ff8989; }
.rank-range-button > [aria-hidden] { display: flex; flex: none; color: #3ed7df; }
.rank-range-button [data-rank-range-label] { flex: 1; min-width: 0; overflow-wrap: anywhere; font-size: 12px; }
.rank-range-edit { flex: none; color: #5adfe5; font-size: 11px; }
.rank-range-picker select { width: 100%; min-width: 0; max-width: 100%; }
.rank-range-preview { padding: 12px; border: 1px solid rgba(117, 173, 187, .18); border-radius: 8px; color: #9fe5e8; font-size: 13px; text-align: center; overflow-wrap: anywhere; }
.rank-range-picker .modal-actions { gap: 8px; flex-wrap: wrap; }
.rank-range-picker .clear-rank-range { margin-right: auto; }
@media (max-width: 420px) {
  .rank-range-edit { font-size: 10px; }
  .rank-range-picker .modal-actions .btn { flex: 1 1 auto; min-width: 0; padding-inline: 10px; }
  .rank-range-picker .clear-rank-range { flex-basis: 100%; margin-right: 0; }
}
@media (max-width: 700px) {
  .issue-time-arrangements { grid-template-columns: 1fr; gap: 12px; }
  .date-range-button { min-height: 76px; padding: 12px; }
  .date-range-copy { font-size: 12px; }
  .date-range-tabs button { min-height: 76px; }
}
@media (max-width: 390px) {
  .date-range-picker .modal-actions .btn { flex: 1 1 auto; min-width: 0; padding-inline: 10px; }
  .date-range-picker .clear-range { flex-basis: 100%; margin-right: 0; }
}
