.grids-section {
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      width: 100%;
      -webkit-box-flex: 3;
      -webkit-flex: 3 3 0%;
      flex: 3 3 0%;
      min-height: 0;
    }

    #countdownScreen[data-layout="2"] .progress-section,
    #countdownScreen[data-layout="2"] .grids-section,
    #countdownScreen[data-layout="4"] .timeline-section,
    #countdownScreen[data-layout="4"] .grids-section,
    #countdownScreen[data-layout="5"] .timeline-section,
    #countdownScreen[data-layout="5"] .progress-section,
    #countdownScreen[data-layout="6"] .timeline-section,
    #countdownScreen:not([data-layout="3"]) .focused-section,
    #countdownScreen[data-layout="3"] #primaryTimelineSection,
    #countdownScreen[data-layout="3"] .progress-section,
    #countdownScreen[data-layout="3"] .grids-section {
      display: none;
    }

    .progress-ruler-section {
      display: none;
      position: relative;
      width: 100%;
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 49px;
      flex: 0 0 49px;
      min-height: 49px;
    }

    #progressRuler,
    #progressRulerLabels {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      color: #20242a;
      pointer-events: none;
    }

    #countdownScreen[data-layout="4"] #progressStage {
      -webkit-box-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
    }

    #countdownScreen[data-layout="4"] .progress-ruler-section {
      display: block;
    }

    #countdownScreen[data-layout="4"] .progress-section {
      -webkit-box-flex: 0;
      -webkit-flex: 0 0 20%;
      flex: 0 0 20%;
    }

    #countdownScreen[data-layout="4"] .activity-chip.is-pending {
      top: 1.5px;
      bottom: 1.5px;
      height: auto;
    }

    .time-grid {
      position: relative;
      width: 33.3333%;
      height: 100%;
      min-width: 0;
      border-right: 1px solid rgba(32, 36, 42, 0.42);
      background: rgba(255, 255, 255, 0.1);
    }

    .time-grid:last-child {
      border-right: 0;
    }

    .cells {
      position: relative;
      width: 100%;
      height: 100%;
      overflow: hidden;
    }

    .time-cell {
      position: absolute;
      border: 1px solid rgba(32, 36, 42, 0.72);
      border-radius: 2px;
      background: #d3cec5;
      -webkit-box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0);
      box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0);
      -webkit-transition: background-color 400ms ease, border-color 400ms ease, -webkit-box-shadow 400ms ease;
      transition: background-color 400ms ease, border-color 400ms ease, box-shadow 400ms ease;
    }

    .time-cell.available {
      background: #b7dfa1;
    }

    .time-cell.current {
      background: #debfa0;
      -webkit-box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0.9);
      box-shadow: inset 0 0 5px 1px rgba(0, 0, 0, 0.9);
    }

    .time-cell.out-of-range {
      background: #efe9de;
      border-color: rgba(255, 250, 235, 0.55);
    }

    #countdownScreen.is-countup-leg .progress-section {
      background: #d3cec5;
    }

    #countdownScreen.is-countup-leg #elapsedFill {
      background: #e0a537;
    }

    #countdownScreen.is-countup-leg .time-cell.available {
      background: #e0a537;
    }