/* Compact Time module - 2026-05-16
   Targeted layout-only change: reduce the Time module height while preserving placement and functionality. */
html body #app.app-shell .dashboard {
  margin-bottom: 14px !important;
}

html body #app.app-shell .dashboard .panel {
  padding: 14px 18px 17px !important;
  border-radius: 24px !important;
}

html body #app.app-shell .dashboard .panel h3 {
  margin: 0 0 9px !important;
  font-size: 1.02rem !important;
  line-height: 1.05 !important;
}

html body #app.app-shell .dashboard .panel::after {
  left: 18px !important;
  right: 18px !important;
  height: 3px !important;
}

html body #app.app-shell .clock-grid {
  gap: 10px !important;
}

html body #app.app-shell .clock-grid .mini-card {
  min-height: 66px !important;
  padding: 9px 11px !important;
  border-radius: 17px !important;
  gap: 3px !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.13), inset 0 0 0 1px rgba(255,255,255,0.28) !important;
}

html body #app.app-shell .clock-grid .mini-card span:first-child {
  font-size: 0.68rem !important;
  line-height: 1 !important;
  letter-spacing: 0.13em !important;
}

html body #app.app-shell .clock-grid .mini-card .time-main,
html body #app.app-shell .clock-grid .mini-card strong {
  font-size: 1.08rem !important;
  line-height: 1 !important;
  letter-spacing: 0.01em !important;
}

html body #app.app-shell .clock-grid .mini-card .time-date {
  font-size: 0.62rem !important;
  line-height: 1 !important;
  letter-spacing: 0.06em !important;
}

@media (max-width: 720px) {
  html body #app.app-shell .dashboard .panel {
    padding: 12px 14px 15px !important;
    border-radius: 22px !important;
  }

  html body #app.app-shell .dashboard .panel h3 {
    margin-bottom: 8px !important;
    font-size: 0.98rem !important;
  }

  html body #app.app-shell .clock-grid {
    gap: 9px !important;
  }

  html body #app.app-shell .clock-grid .mini-card {
    min-height: 60px !important;
    padding: 8px 9px !important;
    border-radius: 16px !important;
    gap: 3px !important;
  }

  html body #app.app-shell .clock-grid .mini-card span:first-child {
    font-size: 0.62rem !important;
    letter-spacing: 0.11em !important;
  }

  html body #app.app-shell .clock-grid .mini-card .time-main,
  html body #app.app-shell .clock-grid .mini-card strong {
    font-size: 1rem !important;
  }

  html body #app.app-shell .clock-grid .mini-card .time-date {
    font-size: 0.56rem !important;
    letter-spacing: 0.045em !important;
  }
}

@media (max-width: 430px) {
  html body #app.app-shell .dashboard .panel {
    padding: 11px 12px 14px !important;
  }

  html body #app.app-shell .clock-grid {
    gap: 8px !important;
  }

  html body #app.app-shell .clock-grid .mini-card {
    min-height: 56px !important;
    padding: 7px 8px !important;
    border-radius: 15px !important;
  }

  html body #app.app-shell .clock-grid .mini-card span:first-child {
    font-size: 0.58rem !important;
  }

  html body #app.app-shell .clock-grid .mini-card .time-main,
  html body #app.app-shell .clock-grid .mini-card strong {
    font-size: 0.94rem !important;
  }

  html body #app.app-shell .clock-grid .mini-card .time-date {
    font-size: 0.52rem !important;
  }
}